Question

我在我的HTML页面中使用了jQuery移动页面，但是当我尝试使用jQuery访问其内部div标签时，find方法什么都不返回。

HTML with jQuery

<iframe id="myframe" src="../codiqa/mobile.htm" 
    style="width: 500px; height: 520px; 
    border: 1px solid #ccc; margin-top:20px;">
</iframe>

这里

$("#myframe").load(function(){
    alert($(this).contents().find('#mobilebutton').html());     
});

iframe中的移动代码

<div id="mobilebutton" data-role="button">Mobile Button</div>

Answer 1

使用window.load代替$("#myframe").load。框架的元素将在$（window）.load事件中准备就绪，您将能够访问它们。

$(window).load(function(){
    alert($("#myframe").contents().find('#mobilebutton').html());     
});

Answer 2

根据jquery API指南：.html（） “获取匹配元素集中第一个元素的HTML内容”

这样你需要在它前面添加.parent来获取有向元素。在这种情况下：

$("#myframe").load(function(){
alert($(this).contents().find('#mobilebutton').parent.html()); });

如果你想获得按钮的html

Answer 3

如果@Adil解决方案不起作用，您可以尝试使用此函数动态添加iframe以附加加载事件：

function callIframe(url, callback) {
    $(document.body).append('<iframe id="myframe" 
                             style="width: 500px; height: 520px; 
                             border: 1px solid #ccc; margin-top:20px;">
                            </iframe> ');
    $('myframe').attr('src', url);
    $('myframe').load(function() 
    {
        alert($(this).contents().find('#mobilebutton').html())
    });
}

如何使用它？

$('document').load(callIframe('../codiqa/mobile.htm'));

此外：

Answer 4

它在IE上运行良好。

试试吧

alert($(this).contents().find('#mobilebutton').html());

jQuery无法在iframe中使用.find（）元素

4 个答案:

如何使用它？

此外：