Question

我有以下内容：

$(document).ready(function() {

  var myIframe = document.getElementById('myIframe');
  var element = myIframe.contentDocument.createElement('script');  
  element.setAttribute('src', '/javascripts/library/jquery/jquery.min.js');  
  myIframe.contentWindow.document.getElementsByTagName('head')[0].appendChild(element);

  $('#myIframe', top.document).load(function() {
    alert('iframe has loaded');

    var element = document.getElementById('myIframe').contentDocument.createElement('script');  
    element.setAttribute('src', '/javascripts/stuff.js');  
    myIframe.contentWindow.document.getElementsByTagName('body')[0].appendChild(element);  
  });

});

我收到“iframe已加载”的提醒。

stuff.js包含

$('body').css('backgroundColor', 'yellow');

所以，我希望当iframe加载时，iframe的背景颜色会变为黄色......但没有任何反应。我甚至尝试在$（document）.ready块中包围stuff.js中的内容，但结果相同。

如果我选择all并查看iframe的源代码，我会看到jquery.min.js和stuff.js位于iframe中。如果我将此源输出放入单独的html文件并运行该文件，则文档的背景颜色会按预期更改。

iframe加载完成后，如何让我的javascript在stuff.js中运行iframe？

Answer 1

你也可以用更简洁的方式来做。

$('<script/>', {
    src: '/path/to/javascript.js',
    type: 'text/javascript'
}).appendTo($('#iframe').contents().find('body'));

Answer 2

天哪，我明白了！

原来它没有用，因为我已经将myIframe.contentDocument.designMode设置为“on”。评论说它成功了。希望我可以在stuff.js加载后打开它，一切都会好的。

如何在iframe中运行动态加载的js文件？

2 个答案: