Может ли codemirror найти текстовые области по классам?

Хорошее начало

Я задал этот вопрос "Codemirror — использовать в нескольких текстовых областях?" несколько лет назад с хороший ответ. Однако он по-прежнему принимает идентификатор в качестве параметра. ID уникальны.

Найти текстовое поле по классу, а не по идентификатору

При наличии нескольких текстовых областей, некоторые с HTML, а некоторые с CSS на одной странице, было бы неплохо добавить класс вместо идентификатора.

Пример

<p>Some content</p>

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

<p>Some content</p>

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

Если я могу использовать для этого jQuery, все в порядке. Я все равно использую это на странице.

Обновление от 21 февраля 2012 года: почти готово

Я нашел этот пост на jsFiddle. Единственное, чего не хватает, это то, что я не могу заставить его работать с текстовыми областями.


javascript jquery codemirror textarea
person Jens Törnell    schedule 21.02.2012    source источник
comment
Вы можете сделать это да. Ваш селектор будет: textarea.my_codemirror_html { }   -  person Undefined    schedule 21.02.2012

Ответы (3)


arrow_upward
13
arrow_downward

Это будет более простое решение с меньшей сложностью.

$('.my_codemirror_html').each(function(index, elem){
      CodeMirror.fromTextArea(elem, {/*options*/});
});
person Faraj Farook    schedule 30.07.2015
comment
На мой взгляд, это должен быть ответ, лучшего решения не нашел. И это менее сложно, чем отмеченный ответ - person Crecket; 24.10.2015

arrow_upward
6
arrow_downward

Я решил это, добавив идентификатор с помощью jQuery во все текстовые области.

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"
                    }
                );

            });
        });
person Jens Törnell    schedule 21.02.2012

arrow_upward
2
arrow_downward

Все версии 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"     
  });
}

Приведенный выше код найдет все текстовые области по классам и преобразует их в отдельные экземпляры codemirror, используя только javascript, а не jQuery.

person Gagich    schedule 08.02.2019