Make iframe listen to same event as parent and synchronize using jquery_问答_开发者

Make iframe listen to same event as parent and synchronize using jquery

开发者 https://www.devze.com 2023-04-02 11:20 出处：网络

I have two iframes in an html page in the same domain <body> <table border=\"1\" width=\"100%\" height=\"100%\">

I have two iframes in an html page in the same domain

<body>
  <table border="1" width="100%" height="100%">
    <tr>
      <th><iframe class="isiframe" width="100%" height="100%" src="/example"></iframe></th>
      <th><iframe class="isif开发者_运维问答rame" width="100%" height="100%" src="/example"></iframe></th>
    </tr>
  </table>
</body>

I have given the click event for all the a tag in the webpage inside the iframe

$('a').bind('click', function(e){
      var path = $(this).getPath();
      var ahash={
                   'path':path
                };
      if (getFrameElement())
         window.parent.document.Aaddevent(e, ahash);
});

The "path" in the click event gives the path of the clicked a tag (eg. html > body > div#bar > ul#abc.def.ghi > li#foo). The getFrameElement() returns the frame which is clicked. Now what i want to do is use this path and trigger the click event in other iframe

I have defined sendevent function from where the other iframe gets the event of the parent iframe and triggers the same event as parent and synchronize.

document.sendevent=function(e, ahash){
    var iframes= parent.document.getElementsByTagName('iframe');
    for (var i= iframes.length; i--;) {
        var iframe= iframes[i];
        if(iframe){
                    $(ahash.path).trigger('click');
                  }
    }
};

This is how i want to do and make the iframe work, follow the path of the parent iframe clicked element and then trigger the click event to make other iframe synchronize with the parent iframe using the path

The click event is not getting triggered inside the sendevent function but i am getting the path of the parent iframe clicked element when i do console.log(ahash .path) inside the sendevent function. How can i make this method work or something similar like that. Please suggest me some solution how to do this.

You cannot follow links using $("a").trigger("click"). You can use location.href = $("a").attr("href"). If you are simply trying to navigate to the same url in both frames don't bother with .getPath(), just pass the href. In your parent page, use this to bind the links in first frame to also navigate the second frame:

$("iframe:first").contents().find("a[href]").click(function() {
    $("iframe:last", top.document)[0].contentWindow.location.href = this.href;
});

Edit: In IE and newer versions of FireFox and Opera, you can use the native DOM method .click() to simulate an actual click on the link. Chrome doesn't support it yet, but probably will eventually. To use .getPath() in order to find and click the link, try this in the parent page:

$("iframe:first").load(function() {
    $(this).contents().find("a[href]").click(function() {
        $("iframe:last", top.document).contents().find($(this.getPath())[0].click();
    });
});