Предварительный просмотр Codemirror - не в iframe?

Question

Я пытаюсь сделать то же самое, что и в этом примере, только код должен быть напечатан не в iframe, а в div.

http://codemirror.net/demo/preview.html

Это не работает ... Мне нужен другой подход.

$("#codeMirrorTextarea").keyup(function () {
     $("#div").html($(this).val());
});

Надеюсь, вы можете помочь!

Answer 1

Использование обычного ванильного JS:

t = document.getElementById('code');
t.addEventListener('input',function(){
    document.getElementById('result').innerHTML = t.value;
});

Использование обработчика событий oninput также добавляет поддержку не клавиатурным устройствам , как указано здесь

Демо

Редактировать: код с использованием CodeMirror:

$(function () {
    $("textarea").each(function (i) {
        editor = CodeMirror.fromTextArea(this, {
             lineNumbers: true
        });
    });
});

document.getElementById('result').innerHTML=editor.getValue();

Демо Обновленная демоверсия , которая также обновляет код.

editor.getValue () использовался в предоставленной вами примерной ссылке .

API CodeMirror для использования getValue () и других методов