Javascript 在 iFrame jQuery 中选择一个元素

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6316979/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 21:14:46  来源:igfitidea点击:

Selecting an element in iFrame jQuery

javascriptiframegetelementbyid

提问by cycero

In our application, we parse a web page and load it into another page in an iFrame. All the elements in that loaded page have their tokenid-s. I need to select the elements by those tokenid-s. Means - I click on an element on the main page and select corresponding element in the page in the iFrame. With the help of jQuery I'm doing it in the following way:

在我们的应用程序中,我们解析一个网页并将其加载到 iFrame 中的另一个页面中。该加载页面中的所有元素都有它们的 tokenid-s。我需要通过那些 tokenid-s 来选择元素。意思是 - 我点击主页上的一个元素,然后在 iFrame 中选择页面中的相应元素。在 jQuery 的帮助下,我按以下方式进行:

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

However with this function I can select the elements in the current page only, not in the iFrame. Could anybody tell me how can I select the elements in the loaded iFrame?

但是,使用此功能,我只能选择当前页面中的元素,而不能选择 iFrame 中的元素。有人能告诉我如何选择加载的 iFrame 中的元素吗?

Thanks.

谢谢。

回答by Darin Dimitrov

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

Also note that if the srcof this iframe is pointing to a different domain, due to security reasons, you will not be able to access the contents of this iframe in javascript.

另请注意,如果src此 iframe 的 指向不同的域,出于安全原因,您将无法在 javascript 中访问此 iframe 的内容。

回答by Kevin Bowersox

Take a look at this post: http://praveenbattula.blogspot.com/2009/09/access-iframe-content-using-jquery.html

看看这篇文章:http: //praveenbattula.blogspot.com/2009/09/access-iframe-content-using-jquery.html

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

Place your selector in the find method.

将您的选择器放在 find 方法中。

This may not be possible however if the iframe is not coming from your server. Other posts talk about permission denied errors.

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

jQuery/JavaScript: accessing contents of an iframe

jQuery/JavaScript:访问 iframe 的内容

回答by Fareed Alnamrouti

when your document is ready that doesn't mean that your iframe is ready too,
so you should listen to the iframe load event then access your contents:

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

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

回答by tibersky

If the case is accessing the IFrame via console, e. g. Chrome Dev Tools then you can just select the context of DOM requests via dropdown (see the picture).

如果案例是通过控制台访问 IFrame,例如 Chrome Dev Tools,那么您可以通过下拉菜单选择 DOM 请求的上下文(见图)。

Chrome Dev Tools - Selecting the iFrame

Chrome 开发工具 - 选择 iFrame

回答by Rajasekharreddy Kadasani

here is simple JQuery to do this to make div draggable with in only container :

这是一个简单的 JQuery 来做到这一点,使 div 可在仅容器中拖动:

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