Question

据我所知，为了正常触发iframe中的onscroll事件处理程序，iframe必须包含一个与包含iframe的页面具有相同域名的站点。但是，无论如何，对于包含外部网站的iframe，可以做到这一点吗？

onscroll事件处理程序：

<script type="text/javascript">
    window.onload = function() {
       var frm = document.getElementById("test").contentWindow;
       frm.onscroll = function(){
          alert("iframe scrolled");
       }
    }
</script>

上面的js代码适用于此：

<iframe id="test" src="http://www.<myDomain>.com"></iframe>

但不是这样：

<iframe id="test" src="http://www.<anExternalSite>.com"></iframe>

如果我不能这样做，我的整个申请将毫无用处。这样做有什么办法吗？任何黑客？

Answer 1

任意外部网站？否。

合作外部网站？让滚动事件侦听器绑定到站点本身（到其body元素）并使用postMessage传递事件数据。

Answer 2

看看Quentin的回答或做一些更hacky的事情，使用代理（http://httpd.apache.org/docs/2.2/mod/mod_proxy.html）从您自己的域提供外部网站，因为跨域策略不会让您这样做。

请注意，代理会增加服务器的流量。

Answer 3

使用此：

  <html>
    <head>
      <style>
        #iframeoverlay { position: absolute; width: same-as-iframe; height: sams-as-iframe; anything-else: sams-as-iframe; z-index: 1-or-higher-if-the-iframe-is-over-1; }
      </style>
      <script>
        function alert() {
          alert("iframe scrolled");
        }
      </script>
    </head>
    <body>
      <iframe ... ></iframe><div id="iframeoverlay" onscroll="alert"></div>
    </body>
  </html>

不确定它是否可行但是尝试一下。

包含外部网站的iframe不会触发onscroll事件处理程序

3 个答案: