使用 jQuery 在 iframe 中选择一个元素

在我们的应用程序中，我们解析一个网页并将其加载到 iframe 中的另一个页面中。加载的页面中的所有元素都有它们的标记 ID。我需要根据这些令牌 ID 选择元素。手段-我点击主页面上的一个元素，然后在 iframe 中选择页面中相应的元素。在 jQuery 的帮助下，我用下面的方法做到了这一点:

function selectElement(token) {
$('[tokenid=' + token + ']').addClass('border');
}

但是使用这个函数，我只能选择当前页面中的元素，而不能选择 iFrame 中的元素。有人能告诉我如何在加载的 iFrame 中选择元素吗？

谢谢。

248187 次浏览

小开

最佳答案

var iframe = $('iframe'); // or some other selector to get the iframe
$('[tokenid=' + token + ']', iframe.contents()).addClass('border');

还要注意，如果这个 iframe 的 src指向一个不同的域，由于安全原因，您将无法在 javascript 中访问这个 iframe 的内容。

小开

$("#iframeID").contents().find("[tokenid=" + token + "]").html();

将选择器放在 find 方法中。

但是，如果 iframe 不来自您的服务器，这可能是不可能的。其他帖子讨论了拒绝允许的错误。

小开

当您的文档准备好时，并不意味着您的 iframe 也准备好了,
所以你应该听到 iframe 加载事件，然后访问你的内容:

$(function() {
$("#my-iframe").bind("load",function(){
$(this).contents().find("[tokenid=" + token + "]").html();
});
});

小开

这里有一个简单的 JQuery，它可以让 div 只能在容器中拖动:

$("#containerdiv div").draggable( {containment: "#containerdiv ", scroll: false} );

小开

如果是通过控制台访问 IFrame，比如 Chrome 开发工具，那么你可以通过下拉菜单选择 DOM 请求的上下文(如图所示)。