Question

我有一个代码段

$(document).on("click", "div[data-role=button]", myfunc);

function myfunc(e){
  alert(event.target);
  alert(e.target);
  alert(event.currentTarget);
  alert(e.currentTarget);
}

当我点击时，每个都给出不同的输出元件。

e类型为对象

事件的类型为MouseEvent

e.currentTarget似乎给出了正确答案。

我的问题是，如果我决定向我的处理程序添加另一个参数，我将如何访问提供正确答案的＆＃34; e＆＃34;，参数。

修改

我想做

function myfunc(e,str){

}

如何在我的函数中访问e以及如何传递这两个参数？

编辑2 我发现了另一件有趣的事情，

this

这个正确地给出了目标，即使我希望它能让文档知道原因吗？

Answer 1

您以与您现在相同的方式访问e，我想你的意思是如何在click事件中设置处理程序。这样怎么样：

$(document).on("click", "div[data-role=button]", function(e) { myfunc(e, "some string"); });

当然，这并不会使“某些字符串”变得非常灵活（除非您在更改时重新绑定事件），因此可以很容易地在myfunc函数中修复它。

如果你希望它基于某些东西，也许是被点击元素的属性，那么也许你想要：

$(document).on("click", "div[data-role=button]", function(e) { myfunc(e, $(this).data("string")); });

将获取data-string属性的值，例如：

<div data-role="button" data-string="my string 1"></div>

Answer 2

Inside myFucnc e是一个引用事件对象的局部变量。 event可能是指闭包或全局变量。

target与currentTarget之间的差异如下：

在事件遍历DOM时标识事件的当前目标。它始终引用事件处理程序附加到的元素，而不是event.target，它标识事件发生的元素。

https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget

在事件处理程序javascript中访问事件对象

2 个答案: