输入删除/撤消的事件处理程序答案

【问题标题】：event handler for input delete/undo输入删除/撤消的事件处理程序
【发布时间】：2013-02-20 22:08:48
【问题描述】：

我需要检查所有会改变我的文本输入内容的事件。到目前为止，我有用于键入、剪切和粘贴的处理程序。但也可以通过突出显示文本并单击删除或撤消来更改内容。有没有办法监听这些事件？

$('#input').on('paste cut  keyup ',function() {
    //add delete and undo to listner
});

【问题讨论】：

标签： javascript jquery

【解决方案1】：

你有更多的问题，你还必须担心具有自动填充功能的浏览器等。为此，HTML5 包含了input 事件，它包含在现代浏览器中。

请参阅this answer，了解一种捕获浏览器让您捕获的每个可能的更改事件(*) 的方法，每次更改不会触发多次。

_{(*) 好像忘记了cut，所以也加进去吧。}

【讨论】：

感谢链接我在那里找到了答案：.bind('DOMAttrModified textInput input change keypress paste focus', function (){ // handle });

【解决方案2】：

我建议使用keydown 和input：http://jsfiddle.net/vKRDR/

var timer;
$("#input").on("keydown input", function(){
    var self = this;
    clearTimeout(timer)
    // prevent event from happening twice
    timer = setTimeout(function(){
        console.log(self.value);
    },0);
});

keyup 不会捕获 ctrl 等特殊键，输入会捕获粘贴删除等内容，即使是从上下文菜单中也是如此。

通过使用 keydown 和 input，事件立即发生，而不是等待用户释放按钮或模糊输入。

keydown 完成了大部分工作，输入在 keydown 无法处理的地方拾取，例如上下文菜单删除/粘贴/剪切

【讨论】：

注意，经过进一步的测试......你应该能够摆脱只使用输入，虽然我不确定它与 IE 的向后兼容性

【解决方案3】：

使用这些，他们会得到所有的改变：

$(container).bind('keyup input propertychange paste change'), function (e){});

另外，您可以做一件事来检查此 onchange 事件中的值：

$(function(){
  $('input').on('keyup input propertychange paste change', function(){
      if ($(this).data('val')!=this.value) {
          alert('Something has been changed in the input.');
      }
      $(this).data('val', this.value);
  });
});

希望这适用于您的情况。 :)

【讨论】：

【解决方案4】：

您至少缺少按键和更改。我不知道“更改”是否适用于这些操作，我知道更改通常只是在输入元素失去焦点时调用。

【讨论】：

【解决方案5】：

使用更改事件。

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

【讨论】：

更改通常只会在失去焦点时触发。