Question

I use CodeMirror(5.58.2) for edited text.

new_cm = CodeMirror.fromTextArea(textarea_obj, param);

But in the textarea, I can easy replace text, just do this obj.value = obj.value.replace( /123/g, 3210 ); What can I do smth like that in CodeMirror? Without any interface requests for user. Just a simple "Make Replace" button and code with a regexp pattern.

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>

友情链接