用html属性设置CodeMirror样式和插件

Set CodeMirror style and addons with a html attribute

本文关键字：样式 插件 CodeMirror 设置 html 属性      更新时间：2023-09-26

我有这个CodeMirror (http://codemirror.net/index.html)文本区域:

<form><textarea id="code" name="code" codemirror-type='lineNumbers: false, styleActiveLine: true, matchBrackets: true;'>CODE HERE</textarea></form>

正如你所看到的，我添加了属性"codemmirror -type"，我想在脚本执行时设置这种风格，我尝试:

<script>
  var attrs = document.getElementById("code").getAttribute("codemirror-type");
  var editor = CodeMirror.fromTextArea(document.getElementById("code"), attrs);
</script>

但它不工作，我想，因为它不是在正确的格式(http://codemirror.net/doc/manual.html#fromTextArea)。

我真的需要样式代码编辑器从HTML属性(或类或添加标签或任何)我怎么能做到这一点?

解决了，这是一个JSON解析问题，给定CodeMirror文本区域如下:

<textarea id="code" name="code" codemirror-settings='{"lineNumbers": true, "styleActiveLine": true, "matchBrackets": true}'>CODE_HERE</textarea>

它可以像这样正确地呈现:

var attrs = document.getElementById("code").getAttribute("codemirror-settings");
var obj = JSON.parse(attrs);
var editor = CodeMirror.fromTextArea(document.getElementById("code"), obj);
相关文章：