为了账号安全,请及时绑定邮箱和手机立即绑定

addEventListener在没有我甚至要求的情况下调用该函数

/ 猿问

addEventListener在没有我甚至要求的情况下调用该函数

炎炎设计 2019-09-13 13:10:12

addEventListener在没有我甚至要求的情况下调用该函数

所以我们有一个页面:

<span id='container'>
    <a href='#' id='first'>First Link</a>
    <a href='#' id='second'>Second Link</a></span>

并想要添加一些点击事件:

first.addEventListener('click', function(){alert('sup!');})

奇迹般有效!但是,当您将第二个参数设为外部函数时:

function message_me(m_text){
    alert(m_text)}second.addEventListener('click', message_me('shazam'))

它立即调用该函数。我怎么能阻止这个?很烦人!

这是一个现场演示:http://jsfiddle.net/ey7pB/1/


查看完整描述

3 回答

?
慕神8447489
function message_me(m_text){
    alert(m_text)} second.addEventListener('click', 
    function() {
        message_me('shazam');
    });

这是一个更新的小提琴



查看完整回答
反对 回复 2019-09-16
?
慕的地2183247

由于第二个参数需要函数引用,因此需要提供一个参数。使用有问题的代码,您将立即调用该函数并传递其结果(这是undefined因为所有函数都是alert并且不返回任何内容)。在匿名函数中调用函数(如第一个示例)或更改函数以返回函数。

你可以这样做:

function message_me(m_text){
    alert(m_text);}second.addEventListener('click', function () {
    message_me('shazam')});

或这个:

function message_me(m_text){
    return function () {
        alert(m_text);
    };}second.addEventListener('click', message_me('shazam'));

演示: http ://jsfiddle.net/tcCvw/



查看完整回答
反对 回复 2019-09-16
?
牛魔王的故事

或者你可以使用.bind

function message_me(m_text){
    alert(m_text);}second.addEventListener('click', message_me.bind(this, 'shazam'));

查看 关于'闭包'的MDN文档


查看完整回答
反对 回复 2019-09-16

添加回答

回复

举报

0/150
提交
取消
意见反馈 邀请有奖 帮助中心 APP下载
官方微信