@daniilshitov
Node js разработчик

Как поставить несколько редакторов кода ace на страницу?

есть такой замечательный редактор ace, и надо поставить редактор js кода и html, но возникла небольшая проблема, редактор инициализирует тег по id , и только одно имя id, имя 'editor' , вот такой прикол редактора.
Так будет работать:
<div id="editor">
              &lt;p class="layer"&gt;привет&lt;/p&gt;
	</div>

editor = ace.edit("editor");
      editor.setTheme("ace/theme/monokai");
      editor.session.setMode("ace/mode/html");

Так не будет :
<div id="htmleditor">
              &lt;p class="layer"&gt;привет&lt;/p&gt;
	</div>

editor = ace.edit("htmleditor");
      editor.setTheme("ace/theme/monokai");
      editor.session.setMode("ace/mode/html");

Объясните что за прикол, и как это обойти, ведь мне надо хотя бы 2 id что бы сделать 2 редактора на стр.
  • Вопрос задан
  • 85 просмотров
Решения вопроса 1
TTATPuOT
@TTATPuOT
https://code.patriotovsky.ru/
Вам не обязательно передавать ID в .edit(). Вы можете передавать элемент:
let editors = document.querySelectorAll('.editor'); //Парсим все элементы с классом "editor"

editors.forEach(function(e) { //Каждому такому элементу создаём редактор
    const editor = ace.edit(e);
    editor.setTheme("ace/theme/monokai");
    editor.session.setMode("ace/mode/html");
});

Вместо id просто указываете class="editor".
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
vexgg
@vexgg
The happiest man alive.
На крайняк есть Codemirror.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы