Question

我正在使用iframe加载外部网址。这是结构 -

<iframe id="iframe-wrapper" src="http://blog.kpmg.ch/" style="width: 100%; height: 100%; overflow-y: scroll"></iframe>

当我滚动浏览iframe内容时，我正在尝试做某事。我尝试了各种方法，没有任何效果。以下是我尝试过的一些事情 -

1）jQuery iframe scroll event (IE)

    $(window).load(function(){
      $($('#iframe-wrapper').contents()).scroll(function(){
       alert("Scrolling");
      }); 
    });

2）jQuery iframe scroll event (IE)

    $('#iframe-wrapper').load(function(){
      $($(this)[0].contentWindow).scroll(function(){
        alert("Scrolling");
      });
    });

3）How to make IFRAME listen to scroll events as parent when click event within parent iframe is triggered

$("#iframe-wrapper").load(function(){
    var iframeContent = getFrameTargetElement( document.getElementById("iframe-wrapper") );
    iframeContent.onscroll = function(e){
        alert("Scrolling");
    };        
});

4）Jquery and binding an event to an iframe

$("#iframe-wrapper").load(function(){
    $("#iframe-wrapper").contents().find("body").scroll( function(e) {
        alert("Scrolling");
    });
});

Answer 1

这不起作用。这是因为同源政策。由于您的网页和iFrame的来源不在同一个域中，因此该活动永远不会在您的主页上触发。在这里阅读更多相关信息：
https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

也许你可以使用其中一种解决方案：
Ways to circumvent the same-origin policy

因此，对于外部URL（不在同一个域中），这将始终存在问题。

将滚动事件绑定到iframe

1 个答案: