jQuery:绑定到表单提交事件时查找被点击的元素？

Question

我认为这应该很简单.说我有以下jQuery:

$someForm.live('submit', function(event) {
// do something
});

如果<button type="submit">该表单中有多个提交按钮(),并且我想引用name被单击的按钮的属性,我将如何在回调函数中执行此操作？

更新 - 澄清

在回调上下文中,既this和event.target指的是形式本身,并且event是一个深度嵌套对象.它可能包含我正在寻找的东西,但我还没有找到它.

另一种表达这个问题的方法是,"如果我正在观看表单上的提交事件(而不是其子元素),那么当我处理该事件时,有什么方法可以确定事件冒泡的子元素到形式？" 被点击的元素在这一点上是否可用,或者浏览器是否只将其视为表单上没有更深层原因的事件？

更新2 - 答案

似乎答案是Nick Craver所说的 - 提交事件源自表单本身,因此无法追溯到具有点击事件而非提交事件的按钮.为了从点击中获取任何进一步的信息,必须有一个按钮的点击监听器.

在某些情况下(如我的),您可能需要1)捕获单击的提交按钮和2)绑定到表单上的提交事件.例如,如果您正在使用jQuery Validate,它会阻止表单提交,直到它有效.如果您通过绑定到按钮单击使表单通过ajax提交,您将绕过该验证.

正如Nick所示,您可以通过使用按钮的单击侦听器捕获按钮信息来解决此问题,然后在表单的提交回调中使用此信息.

将单击回调中的按钮信息传递给表单的提交回调的一种干净方法是用于将jQuery.data()其存储在表单上.例如:

// In the button's click event callback...
jQuery.data($someForm, 'lastSubmitButton', event.target.name);

// In the form's submit event callback...
var whichButton = jQuery.data($someForm, 'lastSubmitButton');

这可以防止需要全局变量.

Answer 1

通常你可以使用event.target元素本身...在这种情况下,因为它是一个原生的DOM属性,所以也可以使用.name:

$someForm.live('submit', function(event) {
  var name = event.target.name;
});

但是,由于submit不是来自按钮,只有一次点击,你想要更像这样的东西:

$("form :submit").live('click', function(event) {
  var name = this.name;
});

this在这里使用,因为正如@ 帕特里克指出的那样,一个人<button>也可以生孩子,在这种情况下,目标可能是孩子.