Javascript addEventListener调用该函数时，我甚至没有要求它这样做

所以我们有一页：

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

工作起来很有魅力！但是，当您将第二个参数设置为外部函数时：

function message_me(m_text){
    alert(m_text)
}

second.addEventListener('click', message_me('shazam'))

它会立即调用该函数。我怎样才能阻止这一切？真烦人

这里有一个现场演示：

引用伊恩的：

---

由于第二个参数需要函数引用，因此需要提供一个。对于有问题的代码，您会立即调用函数并传递其结果（未定义的

…因为函数只执行

警报

，不返回任何内容）。在匿名函数中调用该函数（如第一个示例）或更改该函数以返回函数

---

这里有一个更新的

因为第二个参数需要一个函数引用，所以您需要提供一个。对于有问题的代码，您会立即调用函数并传递其结果（未定义的

…因为函数只执行

警报

，不返回任何内容）。在匿名函数中调用该函数（如第一个示例）或更改该函数以返回函数

您可以这样做：

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'));

演示：

或者您可以使用.bind

function message_me(m_text){
    alert(m_text);
}

second.addEventListener('click', message_me.bind(this, 'shazam'));

检查

---

关于使用箭头函数的“闭包”

现代ES6解决方案

second.addEventListener('click', () => message_me('shazam'))

---

由于第二个参数需要函数引用，因此需要提供一个函数引用。有问题的代码会立即调用函数并传递其结果（未定义）。在匿名函数中调用函数（如第一个示例）或更改函数以返回函数（可能不理想）。为什么这不理想？在im设置的4个左右的addEventListener中复制我的函数似乎不符合D.R.Y.的要求，否？另一个选项是将所需消息作为属性存储在元素上，然后将函数绑定为

second.addEventListener（'click'，message_me）

并让它从属性而不是参数中检索消息。我认为您应该更新接受的答案，因为传递函数时不调用它，绑定-在这里可能是一个更好的选择。你能解释一下为什么你认为绑定是一个更好的选择吗？+1绑定应该是一个不错的选择-不确定4年前是否可用，但肯定是今天的首选方式，而不是创建匿名函数绑定的好建议，肯定应该是公认的答案。你能改变吗？

function message_me(m_text){
    alert(m_text);
}

second.addEventListener('click', message_me.bind(this, 'shazam'));

second.addEventListener('click', () => message_me('shazam'))