Question

我有一个带有jquery更改事件的文本框。

$('#txtAccountNo').change(function(){
        $('label[for="txtAccountNo"]').append('<span class="support">loading...</span>')
    });

当文本框失去焦点时，即用户使用鼠标单击或使用Tab键时，事件有效。但是当按下返回键时，不会触发事件。有人可以帮我解决这个问题吗？

Answer 1

这是change事件的标准行为。如果您想捕获每个 Enter ，请按keypress事件：

$('#txtAccountNo').on('change keypress', function(e) {
  if (e.type == 'change' || (e.type == 'keypress' && e.which == 13)) {
    $('label[for="txtAccountNo"]').append('<span class="support">loading...</span>')
  }
});

Answer 2

正如您所强调的那样，change事件仅在文本输入失去焦点时触发。您应该绑定到keyup：

$('#txtAccountNo').on('keyup', function() { 
    $('label[for="txtAccountNo"]').append('<span class="support">loading...</span>')
});

作为上述的后脚本，维护change事件可能是明智之举，因为当有人将文本粘贴到文本框中时，您可能还希望运行该功能。你可以使用：

来做到这一点

$('#txtAccountNo').on('keyup change', function() { ... });

Answer 3

实际上在现代浏览器和jQuery（似乎在问题中使用）高于1.7，返回按钮将提交更改而不需要失去焦点，代码应该可以工作。

<input/><output/>
$("input").change( function() {
    $("output").val( $("input").val() );
})

在这里查看简单测试： http://jsfiddle.net/4vBSm/2/

虽然在IE 9中没有出现这种情况。（并且jQuery不会修复http://bugs.jquery.com/ticket/11556）

Answer 4

如Matthew的回答所述，问题出现在IE9及更早版本中，但在现代浏览器中则不然。我建议下面的解决方案，它只是将此功能添加到所有浏览器：

$('input[type=text]').on('keypress', function (e) {
    var $input = $(this);
    if (e.which == 13) { // Enter was hit
        $input.trigger('change');
    }
});

它会侦听文本输入上的按键，如果 Enter 被命中，则会触发更改事件。

更改事件未在返回键上触发

4 个答案: