jquery - 确定由 ENTER 触发的表单元素

Question

我正在尝试使用 jquery 来检测何时按下 ENTER 键并且我需要知道哪个表单元素触发了该事件。我找到了用于检测何时按下 ENTER 键的代码，但我无法确定触发它的表单元素的 ID。

    $(document).keypress(function(e) {
    if( e.which == 13 )
        {
        alert( $(this) );               //This shows an object is accessible
        alert( $(this).attr("id") );    //This displays "undefined". Why? How do I determine the id of the object?
        }
    });

Answer 1

使用事件委托，您可以尝试以下代码：

$(document).on('keypress', 'input', function(e) {
    if( e.keyCode === 13 ) {
       console.log(this.id);
    }
});

在您的示例中，您$(this)是document对象本身（而不是触发事件的元素）

另请注意，如果您的所有input字段都id定义了属性，则此代码有效（否则this.id不会为某些元素定义）

Answer 2

我终于发现 $(this).attr("id") 永远不会返回一个 id，因为它是由按键触发的，而不是由在按键之前具有焦点的表单字段触发的，这就是我的情况真的在找。

Answer 3

你可以这样做

$('form input, form select, form radio').keypress(function(e) {
  if(e.which == 13) {
   $form = $(this).closest('form');
   alert($form.attr('id'))
   console.log($form);
  }
});

http://jsfiddle.net/bmmq9/1/

如果你有一个带有控制台的浏览器（比如带有 DevTools 的 Chrome 或带有 Firebug 的 Firefox），你可以使用它console.log而不是alert它会给你提供比它是一个对象的事实更多的信息。但请务必在测试后将其删除，否则 IE 会抛出 javascript 错误。