如何在 iframe 中使用 jQuery 确定元素的祖先（例如，当我们检查元素以在 firebug 中查看时，它会显示完整路径）

Question

我在 html 页面中有两个 iframe

<table border="1" width="100%" height="100%">
  <tr>
    <th><iframe id="i1" width="100%" height="100%" src="/wordpress"></iframe></th>
    <th><iframe id="i2" width="100%" height="100%" src="/wordpress"></iframe></th>
  </tr>
</table>

我已经给出了单击事件，当单击第一个 iframe 中的任何链接时更改第二个 iframe 的 href，以便两个 iframe 加载相同的页面

$('a').click(function(e){
     var id = $(this).attr('id');
     var href = $(this).attr('href');
     var path=$(this).parent();
     var ahash={
        'id':id,
        'href':href,
                'path':path
        };
     if (getFrameElement().id=="i1")
       window.parent.document.Aaddevent(e, ahash);
});

通过访问 id 通过以下方法更改 href

document.sendevent=function(e, ahash){
   if (ahash.id!=undefined) {
      $('#i2', window.parent.document).contents().find('#'+ahash.id).trigger(e);
   } else {
      $('#i2', window.parent.document).attr('src', ahash.href);
   }
};

现在我想要做的是我在单击事件中添加了“路径”，它显示了完成 console.log() 时元素祖先的路径，但并非在所有情况下都按预期显示。我不想像我现在所做的那样通过访问 id 来更改 src，因为这在某种程度上工作正常，但之后当我想访问选项卡时，href 变为空白，并且我没有得到预期的输出（意味着页面视图）在第二个 iframe 内不会改变）。相反，我想使用完整的 DOM 路径，如以下链接中给出的

http:// /davecardwell.co.uk/javascript/jquery/plugins/jquery-getpath/

我无法获取路径并使用它而不是访问 iframe 的 id 来更改 src。我该如何做到这一点，以便在单击第一个 iframe 中的任何选项卡或链接时可以更改第二个 iframe 的路径

Answer 1

听起来您很难保持 iframe 同步 - 当一个 iframe 中的 URL 更改时，您希望它更改另一个 iframe 以匹配。您可以通过仅观察 iframe 的 onload 事件来简化事情，当它触发时，更改其他框架的 location 以匹配：

$("#i1").load(function (e) {
    var url = this.contentWindow.location.href;
    var frameLoc = $("#i2")[0].contentWindow.location;
    if (frameLoc.href != url) {
        frameLoc.href = url;
    }
});