Question

我正在使用以下代码，

document.addEventListener( "DOMContentLoaded", registerEvents, false );

    function registerEvents(){
        var frameHeight = window.innerHeight;
        var fixedHeight = document.getElementById( "fixedSection" ).clientHeight;

        document.getElementById( "dynamic_frame" ).height = (frameHeight - fixedHeight)     -50;

        document.getElementById( "home" ).addEventListener( "click", loadPage( "home" ), false );
    }

    function loadPage( page ){
        document.getElementById( "dynamic_frame" ).src = "../htmls/"+ page+ ".html";
}

我认为当我点击具有ID home的元素时它会加载文件，而是在网页首次加载时加载。

我做错了什么？

Answer 1

这条线没有按照你的想法行事：

loadPage("home")

您使用它就像对loadPage函数的引用一样，但它实际上是调用 loadPage函数并用作对该函数结果的引用（恰好是undefined）。因此，不是将click事件绑定到函数，而是立即调用该函数并将click事件绑定到undefined。

要仅引用该函数，您不需要使用括号：

loadPage

但是，由于您还想向其传递参数，因此您可能需要专门用于此目的的回调函数。像这样：

document.getElementById( "home" ).addEventListener( "click", function () { loadPage( "home" ); }, false );

这将对loadPage的调用包装在匿名函数中，该函数不需要任何参数。将在click事件上调用该匿名函数，并且它在内部执行的所有内容都将使用您想要的参数调用所需的函数。

文件正在加载，为什么？

1 个答案: