Question

我在jQuery函数中引用事件对象时遇到了麻烦：

// Execute a function when an image with the arrow class is clicked
$('.arrow').bind('click',update_support);

// Function tries to refer to the calling image using $(this)
function update_support() {
  alert( $(this).src );
}

// Result: an alert of 'undefined'

这段代码确实有效，但是它会明确地将“this”对象传递给函数，我觉得必须有更好的方法：

$('.arrow').bind('click',update_support(this));

function update_support(obj) {
  alert( obj.src );
}

// Result: an alert with the src of the clicked image

编辑以使我的问题更清晰： 为什么我必须明确地给函数提供任何参数？来自http://api.jquery.com/category/events/event-object的jQuery文档：“事件对象保证传递给事件处理程序。”我的问题是：如果我没有明确地传递它，它在哪里？ ;）？

Answer 1

$('.arrow').bind('click',function(event){ update_support(event);} );

未经测试，但应将对该事件的引用传递给update_support。

修改：您还需要修改update_support，显然：

function update_support(evt) {
  alert( evt.target.src );
}

Answer 2

而不是：

alert( $(this).src );

尝试：

alert( this.src );

$(this)是一个jQuery对象。 this是一个DOM元素。

Answer 3

作为inkedmn和J-P的答案的替代

// Execute a function when an image with the arrow class is clicked
$('.arrow').bind('click',update_support);

// Function tries to refer to the calling image using $(this)
function update_support(e) {
  alert( e.target.src );
}

在这种情况下，

e是event对象（跨浏览器标准化）

如果未在事件处理程序签名中显式定义事件对象参数的参数，则可以使用arguments

引用事件对象

// Execute a function when an image with the arrow class is clicked
$('.arrow').bind('click',update_support);

// Function tries to refer to the calling image using $(this)
function update_support() {
  alert( arguments[0].target.src );
}

但是我诚实地认为，通过显式定义事件对象参数的参数，可以使代码更容易阅读。

如何从外部函数引用事件对象？ - jQuery

3 个答案: