如何将加载到iframe中？

我有逻辑工作从父母追加到我的iframe

这工作：

$('#iframe').load(function() { $(this).contents().find('#target').append('this text has been inserted into the iframe by jquery'); }); 

这不

 $('#iframe').load(function() { $(this).contents().find('body').append(''); }); 

。如果

问题与插入的脚本标记没有正确转义有关。 一半的javascript在html中变得可见，就像第一个脚本标签突然结束一样。

Answer 1

也许错误在于你的字符串，永远不会在javascript中创建一个带有文字的字符串。

 $('#iframe').load(function() { $(this).contents().find('body').append(''); }); 

Answer 2

我有点惊讶的是没有工作 [编辑：不再感到惊讶，请参阅mtrovo的回答 。] …但这是我的工作，根据你的评论，这主要是非jQuery，但仍然很简短：

 var rawframe = document.getElementById('theframe'); var framedoc = rawframe.contentDocument; if (!framedoc && rawframe.contentWindow) { framedoc = rawframe.contentWindow.document; } var script = doc.createElement('script'); script.type = "text/javascript"; script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"; framedoc.body.appendChild(script); 

偏离主题：我真的不会给iframe（或其他任何东西）ID“iframe”。 这只是感觉它有问题（IE有命名空间问题，虽然我不知道它混淆标签名称和ID，但我不会完全震惊）。 我上面使用了“theframe”。

Answer 3

警告：以这种方式加载脚本会使脚本在主窗口上下文中运行，即：如果你使用somescript.js中的窗口，它将不是 iframe的窗口！

 $('#iframe').load(function() { $(this).contents().find('body').append(''); }); 

为此能够使用iframe上下文注入脚本：

 function insertScript(doc, target, src, callback) { var s = doc.createElement("script"); s.type = "text/javascript"; if(callback) { if (s.readyState){ //IE s.onreadystatechange = function(){ if (s.readyState == "loaded" || s.readyState == "complete"){ s.onreadystatechange = null; callback(); } }; } else { //Others s.onload = function(){ callback(); }; } } s.src = src; target.appendChild(s); } var elFrame = document.getElementById('#iframe'); $(elFrame).load(function(){ var context = this.contentDocument; var frameHead = context.getElementsByTagName('head').item(0); insertScript(context, frameHead, '/js/somescript.js'); }