单击eventListener问题

我发现了一个示例任务，当您单击文档中的任意位置时，会在页面上显示警报。在这个任务中，你只需要编辑display（）函数，该函数有两个参数 - myFunc和myObj，这样就可以显示人物对象的名字。我想出了类似的东西，但是警报只在页面刷新后出现，而不是在每次点击文档后出现。单击eventListener问题

function start() { 
    var person = { 
        name : "John" 
    }; 
    function alertName() { 
        alert(""+this.name.toUpperCase() + ""); 
    } 
    document.addEventListener('click', display(alertName, person)); 
} 
function display(myFunc, myObj) { 
    name = myObj.name; 
    myFunc(); 

} 
start();

这里是提琴：

function start() { 
 
    var person = { 
 
        name : "John" 
 
    }; 
 
    function alertName() { 
 
        alert(""+this.name.toUpperCase() + ""); 
 
    } 
 
    document.addEventListener('click', start(alertName, person)); 
 
} 
 
function display(myFunc, myObj) { 
 
    name = myObj.name; 
 
    myFunc(); 
 

 
} 
 
start();

body { 
 
    background-color:yellow; 
 
}

<body> 
 

 
    </body>

来源

2017-08-30 hetious

这不是事件侦听器的工作方式。您不必在回调中选择参数。另外，由于包含了参数，所以在声明事件侦听器时执行函数_at。你需要传递一个_reference到一个function_。你在技术上做的是将display（）函数的_result作为回调参数。这是没有意义的，因为该函数不返回任何东西。而你的小提琴不起作用，因为你调用了一个不存在的函数，并且它与这里的示例不匹配。在发布之前检查你的东西:-) – ADyson

那里没有jquery - 你打算单独使用jquery还是javascript？ –

你要明白，display是一个函数，并通过display(alertName, person)你立即调用它，而不是作为一个事件回调。但是addEventListener需要函数引用作为第二个参数，所以它意味着当调用display(alertName, person)必须返回一个新函数时，将从内部调用alertName（这是一个引用）。

最后，this.name内alertName意味着它需要的myObj上下文中被调用，使用Function.prototype.call做到这一点。

function start() { 
 
    var person = {         
 
    name: "John"     
 
    } 
 
    
 
    function alertName() {         
 
    alert("" + this.name.toUpperCase() + "");     
 
    } 
 
    
 
    document.addEventListener('click', display(alertName, person)); 
 
} 
 

 
function display(myFunc, myObj) { 
 
    return function() { 
 
    myFunc.call(myObj) 
 
    } 
 
} 
 
start();

Click somewhere.

来源

2017-08-30 11:48:01 dfsq

我是初学者，我只是在学习。感谢您的回答 – hetious

这里在的addEventListener第二个参数的问题，必须要调用时，事件会触发功能。

在你的例子中，你传递了一条指令而不是一个函数。你可以做的是在函数体内添加display（）调用，并将该函数作为第二个参数传递：

function start() { 
    var person = { 
        name : "John" 
    }; 
    function alertName() { 
        alert(""+this.name.toUpperCase() + ""); 
    } 
    document.addEventListener('click', function() { 
    display(alertName, person) 
    }); 
} 
function display(myFunc, myObj) { 
    name = myObj.name; 
    myFunc(); 

} 
start();

来源

2017-08-30 11:50:14 RogerC

单击eventListener问题

回答

相关问题