在iframe中运行Javascript/jQuery

我目前正在开发一个网页编辑器，您可以在其中输入HTML，CSS和JavaScript代码并实时查看结果。类似于JSBin或JSFiddle。（我这样做得到一个离线编辑器）在iframe中运行Javascript/jQuery

我已经经历了很多问题，特别是当涉及到CSS，但我解决了他们通过使用iframe并注入我的所有代码。而且，直到你输入一些JavaScript之前，这种方法非常好。

我发送<script></script>之间的代码，但不像CSS，它不会运行。奇怪的是，当我输入$('button').css('color', 'red');之类的东西时，编辑器的按钮会受到影响，但不会影响我的iframe。与我所期望的完全相反。我已经尝试了很多东西，看了很多论坛上的主题，但没有任何作用。我也尝试在我的iframe中加载一个空白页面。在这种情况下，JavaScript会运行，但无法编辑iframe中的代码！这是怎么回事？我哪里错了？预先感谢您的帮助！

这里是我的编辑：https://jsbin.com/tuqite/edit?html,js,output/

来源

2016-04-15 Robin Dos Anjos

请参阅http://stackoverflow.com/questions/22740665/using-textareas-to-display-live-results-in-iframe-using-jquery-add-separate-te – guest271314

呃..它并不真正帮助... –

js代码在父代中运行，这就是为什么它影响编辑器的按钮。 – rajesh

尝试更新这样的iframe的内容。

// this string contains both html and script 
var html_string= "content"; 
document.getElementById('childFrame').src = "data:text/html;charset=utf-8," + escape(html_string);

通过直接更新iframe DOM的方式可能不是正确的方式。

来源

2016-04-15 16:22:18 rajesh

太棒了。简单而有效。非常感谢你！：D –

非常欢迎。感谢接受：） – rajesh

在iframe中运行Javascript/jQuery

回答

相关问题