javascript - 在jquery中单击iframe文档时如何获取包含iframe id

Question

我正在寻找一种方法来使用 jQuery 在单击其文档元素时获取 iframe 的 id。代码将从父窗口初始化运行。

$frame = $("<iframe class='frame'></iframe>").load(function(){
    $(this).contents().bind("click", function(e){
       alert($(this).attr("id"));
    });
}

警报显示为undefined。

或者我也试过：

alert($(this), window.parent).attr("id");

Answer 1

您会注意到，上一个示例仅在您给 iframe 一个边框并单击它时才有效（即单击 iframe 元素，而不是它包含的文档元素，我相信这是您所要求的）。

以下代码将鼠标悬停处理程序绑定到 iframe，它在将 onclick 处理程序绑定到其内容之前获取 iframe 的 ID。请注意，这仅适用于 iframe 指向您网站上的另一个页面，而不是另一个域上的页面。

    $(document).ready(function(){

       $('iframe').bind('mouseover', function(){

          var iframeID = $(this).attr('id');

          $(this).contents().unbind(); 

          $(this).contents().bind('click', function(){

              alert(iframeID);  
          });
       }); 

    });

Answer 2

没有内容到iframe，根据Dio的例子fiddle如下，http://jsfiddle.net/sameerast/FUUz9/

<iframe id="frame" class='frame' width="200" height="200"></iframe>​

Answer 3

这是一个老问题，但我仍然为那些仍然遇到这个问题的人提供答案：

HTML 内容：

<iframe class='frame' id="iframe-1"></iframe>

JQuery 在单击其内容时获取 iframe id：

setTimeout(function(){
    $('.iframe').each(function(){
        var _this = $(this);
        _this.contents().find('body').focus(function(){
            var iframe_id = _this.attr('id');
            alert(iframe_id); // do whatever with it
        });
    });
},1000);

我希望它有帮助...

Answer 4

$(document).ready(function(){
   $('iframe').click(function(){
   Id=$(this).attr('id');
   alert(Id);
 });
});