如何在ace编辑器中评估代码

Question

我试图从ace编辑器获取HTML代码并显示预览iframe.

示例:Code Academy

这是我一直在尝试的:

var textarea = $('textarea[name="html"]');
var view=$('#view');
textarea.hide();
var editor = ace.edit("editor");
editor.setTheme("ace/theme/eclipse");
editor.getSession().setMode("ace/mode/html");
editor.getSession().on('change', function () {
    var preview = view.eval(editor.getSession().getValue());
});
setTimeout(preview, 300);

Answer 1

试试这个:

var textarea = $('textarea[name="html"]');
var view=$('#view');
textarea.hide();
var editor = ace.edit("editor");
editor.setTheme("ace/theme/eclipse");
editor.getSession().setMode("ace/mode/html");
editor.getSession().on('change', function () {
    view.contents().find('body').html(editor.getSession().getValue());
});

我推测view是你的iframe.

我正在使用contents()jQuery函数进入iframe并用编辑器中的内容替换html.