0

我正在尝试编写一些 oo 风格的 js。当我的页面加载时，它会执行我的 login() 函数两次，而我想要触发 login() 的事件侦听器根本不起作用。任何帮助将不胜感激。这是我的代码：

(function( window, undefined ) {
var document = window.document,
    navigator = window.navigator,
    location = window.location;
//build the login button
var DA = {
    width : '70px',
    height : '20px',

    createLoginButton : function(){
        var a = document.createElement('a');
        a.style.width = this.width;
        a.style.height = this.height;
        a.style.cursor = 'pointer';
        var div = document.createElement('div');
        div.id = 'da_login_button';
        div.onclick = DA.login();
        div.innerHTML = "client login";
        div.style.width = this.width;
        div.style.height = this.height;
        div.style.backgroundColor = '#59724A';
        div.style.color = 'white';
        div.style.border = '4px solid #6B5D49';
        div.style.padding = '3px';
        div.style.textAlign = 'center';
        a.appendChild(div);
        return a;
    },

    //write the button to the dom
    writeLoginButton : function(){
        var dest = document.getElementById('digital_arborist_login');
        dest.style.width = this.width;
        dest.style.height = this.height;
        var theButton = DA.createLoginButton();
        dest.appendChild( theButton );
        theButton.addEventListener("click", DA.login(), false);
    },

    //detect ssl
    isSecure : function(){
        if (location.protocol === 'https:') {
            return true;
        } else {
            return false;
        }
    },

    // the login function
    login : function(){ 
        alert('href: '+location.href+'<br />protocol: '+location.protocol);
    },

};  
window.DA = DA; 
})( window )

// start the magic
DA.writeLoginButton();

这是我正在测试我的代码的网页。

4

2 回答 2

2 
theButton.addEventListener("click", DA.login(), false);

在这一行更改DA.login()为 just DA.login。当您这样做时DA.login()，您将函数的结果（login()即undefined）传递给单击处理程序，而不是函数本身。

它应该是：

theButton.addEventListener("click", DA.login, false);

编辑：div.onclick = DA.login();应该div.onclick = DA.login;也是。

于 2012-04-18T15:25:44.740 回答
1

改变这个：

theButton.addEventListener("click", DA.login(), false);

至：

theButton.addEventListener("click", DA.login, false);

和这个：

div.onclick = DA.login();

至：

div.onclick = DA.login;

在每种情况下，您都希望将函数本身分配为回调。您实际上正在执行该函数并将函数调用的结果分配为回调......这就是为什么您的“登录”方法在启动时运行两次以及为什么您的点击事件无法正常运行的原因。

您还应该undefined从第一行删除参数。 undefined是 javascript 中的一个关键字，我真的很惊讶你没有从中得到语法错误。它应该看起来像：

(function(window) {
于 2012-04-18T15:26:53.030 回答