我想使用jQuery在iframe中操纵HTML。

我想我可以通过将jQuery函数的上下文设置为iframe的文档来实现这一点,比如:

$(function(){ //document ready
    $('some selector', frames['nameOfMyIframe'].document).doStuff()
});

然而,这似乎不起作用。一点检查显示,帧['nameOfMyIframe']中的变量未定义,除非等待一段时间加载iframe。然而,当iframe加载时,变量是不可访问的(我得到了拒绝权限的类型错误)。

有人知道这方面的工作吗?


当前回答

如果下面的代码不起作用

$("#iFrame").contents().find("#someDiv").removeClass("hidden");

以下是使其工作的可靠方法:

$(document).ready(function(){ 
  setTimeout(
    function () {
      $("#iFrame").contents().find("#someDiv").removeClass("hidden");
    },
    300
  );
});

这样,脚本将在300毫秒后运行,因此它将有足够的时间加载iFrame,然后代码将生效。有时iFrame不会加载,脚本会在它之前执行。300ms可以根据您的需要调整为任何其他值。

其他回答

Use

iframe.contentWindow.document

而不是

iframe.contentDocument

如果<iframe>来自同一个域,则元素很容易作为

$("#iFrame").contents().find("#someDiv").removeClass("hidden");

参考

我最后在这里寻找的是一个没有jquery的iframe的内容,所以对于其他人来说,这就是:

document.querySelector('iframe[name=iframename]').contentDocument

您是否使用jQuery的内置就绪函数尝试过经典的等待加载完成的方法?

$(document).ready(function() {
    $('some selector', frames['nameOfMyIframe'].document).doStuff()
} );

K

如果下面的代码不起作用

$("#iFrame").contents().find("#someDiv").removeClass("hidden");

以下是使其工作的可靠方法:

$(document).ready(function(){ 
  setTimeout(
    function () {
      $("#iFrame").contents().find("#someDiv").removeClass("hidden");
    },
    300
  );
});

这样,脚本将在300毫秒后运行,因此它将有足够的时间加载iFrame,然后代码将生效。有时iFrame不会加载,脚本会在它之前执行。300ms可以根据您的需要调整为任何其他值。