Jquery：当用户清除文本框时如何触发事件

Question

我有一个当前正在处理.keypress事件的函数，当用户在文本框中对某些代码执行某些操作时，我希望在用户清除文本框时也会触发相同的事件。用户将焦点更改为其他内容后触发

谢谢

Answer 1

keyup事件将检测用户是否也清除了该框（即退格会引发事件，但退格不会引发IE中的keypress事件）

$("#inputname").keyup(function() {

    if (!this.value) {
        alert('The box is empty');
    }

});

jsFiddle

正如Josh所说，对于在输入中按下的每个字符代码都会被触发。这主要是表明您需要使用keyup事件来触发退格，而不是您当前使用的keypress事件。

Answer 2

Jonathon Bolster的解决方案并未涵盖所有案例。我将其改编为通过剪切和粘贴来修改：

$("#inputname").on('change keyup copy paste cut', function() {
    //!this.value ...
});

请参阅http://jsfiddle.net/gonfidentschal/XxLq2/

不幸的是，无法捕获使用javascript设置字段值的情况。如果您自己设置值，那么这不是问题，因为您知道何时这样做...但是当您使用像AngularJS这样的库时，状态发生变化时会更新视图，那么它可能会更加有效。或者您必须使用计时器来检查值。

另请参阅Detecting input change in jQuery?的答案，该答案表明现代浏览器理解“输入”事件。所以只是：

$("#inputname").on('input', function() {
    //!this.value ...
});

Answer 3

另一种以简洁方式做到这一点的方法是倾听＆＃34;输入＆＃34; textarea上的事件/输入类型：文本字段

/**
 * Listens on textarea input.
 * Considers: undo, cut, paste, backspc, keyboard input, etc
 */
$("#myContainer").on("input", "textarea", function() {
    if (!this.value) {

    }
});

Answer 4

您可以在on input的function（）中检查输入字段的值，并将其与if / else语句结合使用，它将在下面的代码中很好地起作用：

$( "#myinputid" ).on('input', function() {

         if($(this).val() != "") {

           //Do action here like in this example am hiding the previous table row

                   $(this).closest("tr").prev("tr").hide(); //hides previous row

         }else{

             $(this).closest("tr").prev("tr").show(); //shows previous row
         }
    });

Answer 5

在.keypress或.keyup函数中，检查输入的值是否为空。例如：

$("#some-input").keyup(function(){
 if($(this).val() == "") {
  // input is cleared
 }
});

<input type="text" id="some-input" />