代码镜像。替换文本的简单方法？

Question

我使用 CodeMirror(5.58.2) 来编辑文本。

new_cm = CodeMirror.fromTextArea(textarea_obj, param);

但是在文本区域，我可以轻松替换文本，只需这样做obj.value = obj.value.replace( /123/g, '3210'); 我可以在 CodeMirror 中做什么？对用户没有任何接口请求。只是一个简单的“制作替换”按钮和带有正则表达式模式的代码。

Answer 1

这是一个例子...

// 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);

Answer 2

我试过了，效果很好：

<!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>

代码镜像。替换文本的简单方法？

CodeMirror. An easy way to replace text?

javascript

codemirror