RawClicked
我有旧的 tr 事件分配方法,如下所示:
<tr ondblclick="RawClicked(this) .......
我想像这样在 JavaScript 代码中附加事件,并删除在 HTML 标记 <tr .... >
中分配事件处理程序:
var element = document.getElementById("CustomersTable").getElementsByTagName("tr");
AssigningEventHandles(element, "dblclick", RawClicked(this));
function AssigningEventHandles(element, event, handler) {
if (element.addEventListener) {
element.addEventListener(event, handler, false);
}
else if (element.attachEvent) {
element.attachEvent("on"+ event, handler);
}
}
function RawClicked(raw) {
var rawDoubleClicked = raw.id;
alert(rawDoubleClicked);
}
那么如何传递参数this
在这种情况下的函数?
最佳答案
在您的示例中
element
是节点的集合,而不是单个元素,因此您不能以这种方式添加事件监听器。您可以迭代此节点集合或使用事件委托(delegate)并将事件监听器附加到<table>
.在这一行
AssigningEventHandles(element, "dblclick", RawClicked(this));
RawClicked 的执行方式为this
绑定(bind)到全局对象。所以参数传递为handler
至AssigningEventHandles
是这个函数的结果,它是无效的。您应该传递这样的函数:AssigningEventHandles(element, "dblclick", RawClicked);
然后使用this.id
而不是raw.id
在RawClicked
.
固定代码:
var element = document.getElementById("CustomersTable").getElementsByTagName('tr');
AssigningEventHandles(element, "dblclick", RawClicked);
function AssigningEventHandles(element, event, handler) {
if( !element.length ){ /* convert to array if it's a single node */
element = [element];
}
for( var i=0; i<element.length; i++){ /* iterate over nodes and attach event listeners */
if (element[i].addEventListener) {
element[i].addEventListener(event, handler, false);
}
else if (element[i].attachEvent) {
element[i].attachEvent("on"+ event, handler);
}
}
}
function RawClicked() {
/* `this` is bound to the clicked element */
var rawDoubleClicked = this.id;
alert(this);
}
关于javascript - 如何附加事件 "ondblclick",其直接分配的处理程序将 "this"作为参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14387171/