textArea 和 CodeMirror：如何填充文本区域并突出显示？答案

【问题标题】：textArea and CodeMirror: How to fill text area and highlight?textArea 和 CodeMirror：如何填充文本区域并突出显示？
【发布时间】：2010-08-24 08:30:24
【问题描述】：

我有以下内容： textarea 和 button，我想用预定义的文本填充它，同时用 CodeMirror 进行语法高亮：

$('#query1').button()
                .click(function() {
                    $('#queryText').val(<?php echo $queryArray[0];?>);
                }

然后：

<form id="queryFrom" name="queryBox"
    action="processquery.php" method="get">
        <textarea id="queryText"
    name="queryText" cols="120" rows="30">
    </textarea>
    </form> 
<button id="query1">Query1</button>
<script type="text/javascript" src="js/code/js/codemirror.js"></script>

<script type="text/javascript">

var editor = CodeMirror.fromTextArea('queryText', {
      height: "150px",
      parserfile: "parsesql.js",
      path: "js/code/js/",
      stylesheet: "js/code/css/sqlcolors.css",
      textWrapping: true
    });
</script>

不幸的是，如果启用了 CodeMirror，按钮中的文本不会填满该区域。有什么问题？

向阿尔曼致敬。

【问题讨论】：

CodeMirror 接受 DOM 节点或带有元素 id 的字符串。我遇到了同样的问题：在我的 textarea 上设置 CodeMirror 后，我可以捕获（使用 jquery 或其他）更多事件。

标签： jquery button textarea codemirror

【解决方案1】：

我用来创建 CodeMirror 文本区域的是：

CodeMirror.fromTextArea(document.getElementById('queryText'), {
  // your settings here
});

注意 getElementById 而不是只给出字段的名称/ID。

因此，我认为您还应该在 PHP 部分周围加上引号，所以：

val('<?php echo $data[0]; ?>')

如果 onclick 事件加载了正确的文本，您应该检查您的源代码。如果它不起作用，请尝试在 onclick 中对 PHP 文件执行 getJSON() 代码，该文件返回一个 json 编码数组，其中包含数据作为唯一键（data[0].field 或类似的东西）。

【讨论】：

你仍然可以使用 jQuery...CodeMirror.fromTextArea( $('#myTextAreaId')[0], { /** settings **/ }); 注意选择器后面的[0]。

【解决方案2】：

我找到了一个CodeMirror JQuery plugin，它承诺解决 jquery 添加其他事件处理程序的问题，但它对我不起作用：-/

这将是设置它的新方法：

$("textarea#codemirror").codemirror({
    lineNumbers : true,
    matchBrackets : true,
    tabMode: "indent"
});

【讨论】：