javascript - 如何在 Javascript 或 Jquery 中设置 "backspace press"事件的监听器？

Question

我有一个按钮，如果输入中存在或不存在文本，则分别启用或禁用该按钮，如下面的代码 fragment 所示:

var input = document.getElementById('myInput');
var btn = document.getElementById('myButton');

$(input).on('keyup', function(){
  if((input.value != null) && (input.value != ''))
    $(btn).removeClass('btnDisabled');
  else
    $(btn).addClass('btnDisabled');
});

使用 keyup 事件，它在我的 Android 6.0.1 智能手机上的应用程序中运行良好。但由于某种原因，在 Android 4.4.2 的平板电脑上，如果按下退格键直到输入开始，删除所有文本值，该按钮仍然启用。我研究了这个问题，但我仍然不确定 WebView 版本是否会干扰这个问题。我想是的。

我使用了其他代码 fragment 来查看该事件是否是由“退格”按钮触发的，如下所示:

  $(input).on('keydown', function(event){ //I tried keyup, keydown and keypress
      var key = event.keyCode || event.charCode;

      console.log("keydown " + key, "length " + input.value.length);
      //if(key == 8 && input.value.length == 1) $(btn).addClass('btnDisabled');
    });

通过此测试，我发现退格键不会触发事件，并且变量 key 始终等于 0。

当输入为空时，我需要禁用该按钮。我哪里出错了？

现在，我感谢那些帮助我的人! :D

Answer 1

您可以使用另一个事件:input

https://developer.mozilla.org/en-US/docs/Web/Events/input

The DOM input event is fired synchronously when the value of an <input>, <select>, or <textarea> element is changed.

在这种情况下，请更改

$(input).on('keydown', 

到

$(input).on('input', 

另请参阅:https://caniuse.com/#search=input