javascript - jQuery addEventListener 找不到函数

Question

我有一个页面使用 window.postMessage 监听来自另一个域上的页面的消息(通过 iframe)。我以前的代码有效:

<script type="text/javascript">
    window.addEventListener("message", receiveMessage, false);

    function receiveMessage(event) {
      if (event.data == "scrollTop"){
          window.scrollTo(0,0);
      }
    }
</script>

即使上面的代码有效，我需要限制它执行，除非 .postMessage 来自特定域 ( http://origindomain.com )，所以我将上面的代码更改为以下内容:

<script type="text/javascript">
    window.addEventListener("message", receiveMessage, false);

    $(function () {
        $.receiveMessage(function(event){  
            if (event.data == "scrollTop") {
                window.scrollTo(0, 0);
            }

            // An optional origin URL (Ignored where window.postMessage is unsupported).
            }, 'http://origindomain.com' );
        });
    });
</script>

第二种方法行不通。 Firebug 控制台的错误输出是:

ReferenceError: receiveMessage is not defined
window.addEventListener("message", receiveMessage, false);

jQuery 不是我的第一语言，所以如果解决方案显而易见，我深表歉意。为什么未定义 receiveMessage() 回调？

Answer 1

您从未定义过 receiveMessage，而是尝试使用 $.receiveMessage。你错过了使用 jquery 方法，你并不总是需要等待 dom 准备好。您也根本不需要 jquery。

<script type="text/javascript">
    window.addEventListener("message", receiveMessage, false);

    //$(function () {
    function receiveMessage(event){  
        if (event.origin == "http://origindomain.com" && event.data == "scrollTop") {
            window.scrollTo(0, 0);
        }
    }
    //});
</script>

如果您安装了一个定义了 $.receiveMessage 的 jQuery 插件，那么您可能根本不需要第一行，因为插件应该会处理它。但是，我不确定为什么此功能需要插件。