我使用CodeMirror (5.58.2)来编辑文本。new_cm = CodeMirror.fromTextArea(textarea_obj, param);但是在文本区域中，我可以轻松替换文本，只需执行以下操作obj.value = obj.value.replace( /123/g, '3210'); 我可以在 CodeMirror 中做类似的事情吗？无需向用户提出任何接口请求。只是一个简单的“Make Replace”按钮和带有正则表达式模式的代码。
2 回答
翻翻过去那场雪
TA贡献2065条经验 获得超13个赞
这是一个例子......
// start the editor instance
const new_cm = CodeMirror.fromTextArea(textarea_obj, param);
// get the entire editor text from CodeMirror editor
let text = new_cm.getValue();
// edit the text, for example
text = text.replace(/abc/g, '');
// set the text back to the editor
new_cm.setValue(text);
千巷猫影
TA贡献1829条经验 获得超7个赞
我尝试了一下，效果非常好：
<!doctype html>
<html>
<head>
<title>CodeMirror</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="UTF-8">
<link rel=stylesheet href="https://CodeMirror.net/doc/docs.css">
<link rel="stylesheet" href="" id="modeFile">
<link rel="stylesheet" href="colorpicker/addon/codemirror-colorpicker.css" />
<link rel="stylesheet" href="colorpicker/addon/codemirror-colorpicker.css" />
<script src="https://CodeMirror.net/addon/hint/anyword-hint.js" id="anyword"></script>
<link rel="stylesheet" href="https://CodeMirror.net/lib/codemirror.css">
<link rel="stylesheet" href="https://CodeMirror.net/addon/hint/show-hint.css">
<link rel="stylesheet" href="https://CodeMirror.net/addon/dialog/dialog.css">
<link rel="stylesheet" href="https://CodeMirror.net/addon/search/matchesonscrollbar.css">
<script type="text/javascript" src="colorpicker/addon/codemirror-colorpicker.js"></script>
<script type="text/javascript" src="colorpicker/addon/codemirror-colorpicker.js"></script>
<script src="https://CodeMirror.net/lib/codemirror.js"></script>
<script src="https://CodeMirror.net/addon/edit/closetag.js"></script>
<script src="https://CodeMirror.net/addon/hint/show-hint.js"></script>
<script src="https://CodeMirror.net/addon/hint/sql-hint.js"></script>
<script src="https://CodeMirror.net/addon/mode/loadmode.js"></script>
<script src="https://CodeMirror.net/mode/meta.js"></script>
<script src="https://CodeMirror.net/addon/hint/xml-hint.js"></script>
<script src="https://CodeMirror.net/addon/hint/html-hint.js"></script>
<script src="https://CodeMirror.net/addon/search/jump-to-line.js"></script>
<script src="https://CodeMirror.net/addon/hint/javascript-hint.js"></script>
<script src="https://CodeMirror.net/mode/xml/xml.js"></script>
<script src="https://CodeMirror.net/mode/javascript/javascript.js"></script>
<script src="https://CodeMirror.net/mode/css/css.js"></script>
<script src="https://CodeMirror.net/mode/htmlmixed/htmlmixed.js"></script>
<script src="https://CodeMirror.net/addon/dialog/dialog.js"></script>
<script src="https://CodeMirror.net/addon/search/searchcursor.js"></script>
<script src="https://CodeMirror.net/addon/search/search.js"></script>
<script src="https://CodeMirror.net/addon/fold/xml-fold.js"></script>
<script src="https://CodeMirror.net/addon/scroll/annotatescrollbar.js"></script>
<script src="https://CodeMirror.net/addon/search/matchesonscrollbar.js"></script>
<script src="https://CodeMirror.net/addon/runmode/runmode.js"></script>
<script src=" https://CodeMirror.net/addon/runmode/colorize.js"></script>
</head>
<body>
<div id="editor"></div>
<button onclick="find()">find</button>
<button onclick="replace()">replace</button>
<button onclick="JTL()"Jump-To-Line</button>
<button onclick="undo()">undo</button>
<button onclick="redo()">redo</button>
<script>
function find() {
editor.execCommand('find');
}
function undo() {
editor.execCommand('undo');
}
function redo() {
editor.execCommand('redo');
}
function Replace() {
editor.execCommand('replace');
}
function JTL() {
editor.execCommand('jumpToLine');
}
</script>
<script>
var editor = CodeMirror(document.getElementById('editor'),{
mode: 'text/html',
matchBrackets: true,
lineNumbers: true,
});
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消