CodeMirror missing line numbers, it shows a simple textarea only

好久不见. 提交于 2020-07-22 05:50:29

问题


I have integrated CodeMirror with below code,

<style>
.CodeMirror {
    border-top: 1px solid #888; 
    border-bottom: 1px solid #888;
}
</style>
<body>
    <textarea id="myCode"></textarea>    
    <script type="text/javascript">
      window.onload = function() {
        var myTextarea = $("#myCode")[0];
        editor = CodeMirror.fromTextArea(myTextarea, {
          lineNumbers: true
        });
      };
    </script>
</body>

It shows a normal textarea only, which doesn't look like an editor and the line numbers are missing. Please help me if anything I am missing.

When I replace the line var myTextarea = $("#myCode"); with var myTextarea = $("#myCode")[0], it displays the edotor as well.


回答1:


Look at this fiddle.

HTML:

<textarea id="code"></textarea>

JS:

var minLines = 5;
var startingValue = '';
for (var i = 1; i < minLines; i++) {
    startingValue += '\n';
}

var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
    lineNumbers: true,
    gutter: true,
    lineWrapping: true,
    value: startingValue
});

//FIX FOR MIN LINES
//http://stackoverflow.com/questions/10380759/codemirror-minimum-lines-number
editor.setValue(startingValue);


来源:https://stackoverflow.com/questions/39093796/codemirror-missing-line-numbers-it-shows-a-simple-textarea-only

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!