codemirror 可以按类查找文本区域吗？答案

【问题标题】：Can codemirror find textareas by class?codemirror 可以按类查找文本区域吗？
【发布时间】：2012-02-21 09:17:55
【问题描述】：

一个好的开始

几年前我问过这个问题“Codemirror - Use on multiple textareas?”，答案很好。但是，它仍然需要一个 ID 作为参数。 ID 是唯一的。

按类而不是 ID 查找 textarea

当在同一页面上有多个文本区域时，一些带有 HTML 和一些带有 CSS，最好添加一个类而不是 ID。

示例

<p>Some content</p>

<textarea class="my_codemirror_html">
</textarea>

<p>Some content</p>

<textarea class="my_codemirror_html">
</textarea>'

如果我可以使用 jQuery，那很好。无论如何，我在页面上使用它。

2012-02-21 更新 - 快到了

我在jsFiddle 上找到了这篇文章。唯一缺少的是我无法让它在 textareas 上工作。

【问题讨论】：

您可以这样做。您的选择器将是： textarea.my_codemirror_html { }

标签： javascript jquery textarea codemirror

【解决方案1】：

这将是一个更简单的解决方案，复杂性更低。

$('.my_codemirror_html').each(function(index, elem){
      CodeMirror.fromTextArea(elem, {/*options*/});
});

【讨论】：

这应该是我认为的答案，找不到比这更好的解决方案。而且它没有标记的答案那么复杂

【解决方案2】：

我通过向所有文本区域添加一个带有 jQuery 的 ID 来解决它。

jQuery(document).ready(function($) {
            var code_type = '';
            $('.code-html').each(function(index) {
                $(this).attr('id', 'code-' + index);
                CodeMirror.fromTextArea(document.getElementById('code-' + index), {
                        mode: "text/html",
                        lineNumbers: true,
                        tabMode: "indent"
                    }
                );

            });
        });

【讨论】：

【解决方案3】：

所有javascript版本：

var codemirrorInstance = [];
var foundtextareasarr = document.getElementsByClassName('classForTextareas');
for(var i = 0; foundtextareasarr[i]; ++i) { 
  codemirrorInstance[i] = CodeMirror.fromTextArea(foundtextareasarr[i], {
    lineNumbers: true,
    mode: "add-your-mode-here"     
  });
}

上面的代码将按类查找所有文本区域，并仅使用 javascript 而不是 jQuery 将它们转换为单独的 codemirror 实例。

【讨论】：