そのため、現在、Ace と jQuery で生成された iFrame を使用して、iFrame の Ace テキストエリアに記述されたコーディングをプレビューするプレビュー付きのエディターに取り組んでいます。正常に動作しますが、そこで書いたスクリプトが読み込まれません (具体的には jQuery/JS について話します)。
だからここに私のマークアップがあります:
<div class="box" id="snippet">
<input type="text" name="name" class="appname" id="appname" placeholder="App name" />
<div class="snippettext apptext" id="editor">Write code here!</div>
<textarea id="editorhidden"></textarea>
<div id="previewcode">
</div>
</div>
そして、ここに私のjQuery/javascriptがあります:
$(document).ready(function(){
var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/javascript");
var $frame = $('<iframe id="previewframe">');
$('#previewcode').html($frame);
setTimeout( function() {
var doc = $frame[0].contentWindow.document;
var $body = $('body',doc);
$body.html(editor.getValue());
$frame.contents().find('body').prepend('<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"><\/script>').end();
}, 1 );
$(".updatepreview").click(function(){
var doc = $frame[0].contentWindow.document;
var $body = $('body',doc);
$body.html(editor.getValue());
$frame.contents().find('body').prepend('<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"><\/script>').end();
$(".loadingimage").hide();
});
});
jQueryでjQueryを処理することについて何かがあると思いますが、それを修正する方法が本当にわかりません。どんな助けでも大歓迎です-ありがとう:)。