如何将参数传递给 addEventListener 函数？

如何向 addEventListener 监听器函数传递参数

在我们想要向事件监听器函数传递参数的场景中，我们可能会遇到参数为函数内无法访问。当我们将变量分配给函数时，可能会发生这种情况，如下所示：

var someVar = some_other_function();
someObj.addEventListener("click", function(){
    some_function(someVar);
}, false);

这里，问题是 someVar 的值在事件侦听器的函数中不可用。

A更好的方法：使用事件目标的参数

为了解决这个问题，我们可以利用事件对象的 target 属性来检索传递给侦听器的参数 功能。考虑这个例子：

const someInput = document.querySelector('button');
someInput.addEventListener('click', myFunc, false);
someInput.myParam = 'This is my parameter';

function myFunc(evt)
{
    window.alert(evt.currentTarget.myParam);
}

在此修改后的代码中：

• 我们将参数（“这是我的参数”）分配给输入元素的 myParam 属性。
• 我们的 myFunc 函数是在事件侦听器的范围之外定义的。
• 单击输入元素时， myFunc 函数被调用。
• 在 myFunc 函数中，我们可以通过 evt.currentTarget.myParam 访问我们的参数。

这种方法有效地允许我们将参数传递给事件侦听器函数没有遇到原来的问题。

以上是如何将参数传递给 addEventListener 函数？的详细内容。更多信息请关注PHP中文网其他相关文章！