Question

可能重复：
Jquery: how to detect a textbox's content has changed

我想检测用户的键盘操作何时改变文本字段的值。它应该在现代浏览器中保持一致。

.keypress事件的JQuery页面说它不一致？此外，它不适用于退格键，删除等。

我不能使用.keydown，因为它会对shift，alt和箭头键等作出反应。此外，当用户按住某个键并插入多个字符时，它不会触发多次。

我缺少一种简洁的方法吗？或者我应该使用.keydown并过滤掉由箭头键，移位等触发的事件？我主要担心的是，我不知道应该过滤掉的密钥。（我几乎忘记了alt和ctrl，我想可能还有其他人）但那么我怎样才能检测到按下的键并插入多个字符？

作为奖励，它会检测由于粘贴而导致的更改（包括右键单击），但我可以从here获得解决方案。

Answer 1

您可以将'input'事件绑定到文本框。这会在每次输入时触发，因此当您粘贴某些内容时（即使右键单击），请删除并输入任何内容。

$('#myTextbox').on('input', function() { // do something });

如果你使用change处理程序，这只会在用户取消选择输入框后触发，这可能不是你想要的。

这里有一个例子：http://jsfiddle.net/6bSX6/

Answer 2

使用jquery change event

描述：将事件处理程序绑定到“更改”JavaScript事件，或在元素上触发该事件。

一个例子

$("input[type='text']").change( function() {
  // your code
});

.change优于.keypress，.focus，.blur的优势在于.change事件仅在输入发生变化时才会触发

Answer 3

我最近使用以下功能实现了相同的功能。

我想在编辑时启用SAVE按钮。

不建议更改事件，因为只有在编辑完成后才会触发更改事件，在单击“保存”按钮之前单击页面上的其他位置鼠标。
按键不会处理Backspace，Delete和Paste选项。
Key Up处理所有内容，包括标签，Shift键。

因此我在下面写了一个功能，结合了按键，键盘（用于退格键，删除）和文本字段的粘贴事件。

希望它对你有所帮助。

function checkAnyFormFieldEdited() {
    /*
     * If any field is edited,then only it will enable Save button
     */
    $(':text').keypress(function(e) { // text written
        enableSaveBtn();
    });

    $(':text').keyup(function(e) {
        if (e.keyCode == 8 || e.keyCode == 46) { //backspace and delete key
            enableSaveBtn();
        } else { // rest ignore
            e.preventDefault();
        }
    });
    $(':text').bind('paste', function(e) { // text pasted
        enableSaveBtn();
    });

    $('select').change(function(e) { // select element changed
        enableSaveBtn();
    });

    $(':radio').change(function(e) { // radio changed
        enableSaveBtn();
    });

    $(':password').keypress(function(e) { // password written
        enableSaveBtn();
    });
    $(':password').bind('paste', function(e) { // password pasted
        enableSaveBtn();
    });


}

Answer 4

使用$.on()将您选择的事件绑定到输入，不要使用$.keydown()等快捷方式，因为从jQuery 1.7开始$.on()是附加事件处理程序的首选方法（请参阅此处：http://api.jquery.com/on/和http://api.jquery.com/bind/）。

$.keydown()只是$.bind('keydown')的快捷方式，而$.bind()是$.on()取代（等等）。

要回答您的问题，据我所知，除非您需要专门针对keydown发起事件，否则change事件应该为您解决问题。

$('element').on('change', function(){
    console.log('change');
});

要回复以下评论，请在此处记录javascript change事件：https://developer.mozilla.org/en-US/docs/Web/Events/change

以下是使用jQuery处理输入元素的change事件的工作示例：http://jsfiddle.net/p1m4xh08/

Answer 5

您可以使用jQuery change（）函数

$('input').change(function(){
  //your codes
});

有关如何在API页面上使用它的示例：http://api.jquery.com/change/

JQuery：检测输入字段的变化

5 个答案: