javascript - 为什么 jQuery.change() 只在我离开元素时触发？

Question

我有一个 textarea 元素，我想在输入时在 textarea 上方打印所写的字符数。HTML 如下所示：

<p id="counter"></p>
<textarea id="text"></textarea>

和javascript：

jQuery( "#text" ).change( function(){
    var numberOfChars = jQuery( "#text" ).val().length;
    jQuery( "#counter" ).html( numberOfChars );
});

但是当我在文本区域之外单击时，计数器只会“更新”。这是为什么？我希望计数器在我写作时即时更新。

score 11 · Accepted Answer

这是更改事件的已知行为。在元素失去焦点之前它不会触发。从文档：

当元素的值改变时，change 事件被发送到元素。此事件仅限于元素、框和元素。对于选择框、复选框和单选按钮，当用户使用鼠标进行选择时会立即触发该事件，但对于其他元素类型，该事件会延迟到元素失去焦点为止。

我会将脚本绑定到 keyup （您可以使用其他键事件，但 up 在这种情况下最有意义）：

jQuery( "#text" ).keyup(function(){
    var numberOfChars = jQuery( "#text" ).val().length;
    jQuery( "#counter" ).html( numberOfChars );
});

score 1 · Accepted Answer

1

尝试使用keyup事件而不是change。看看它在行动：http: //jsfiddle.net/ren4A/1/

于 2012-03-05T13:58:11.087 回答

score 1 · Accepted Answer

1

尝试 .on('keyup') 或 .on('keypress') 或 .on('keydown')

于 2012-03-05T13:58:20.680 回答

score 1 · Accepted Answer

$('input#myId').bind('input', function() {
  //some code
});

它允许检测keyup事件，用鼠标粘贴数据......

4 回答 4