jQuery“输入”事件

在input看到这个jsfiddle之前，我从未听说过jQuery中的一个事件。

您知道它为什么起作用吗？它是别名keyup还是其他？

$(document).on('input', 'input:text', function() {});

通过用户界面更改元素的文本内容时发生。

它并不是一个别名，keyup因为keyup即使该键不执行任何操作也会触发（例如：按下然后释放Control键将触发一个keyup事件）。

考虑它的一个好方法是这样的：每当输入更改时，该事件就会触发。这包括-但不限于-按下可修改输入的键（因此，例如，Ctrl它本身不会触发该事件，但是Ctrl-V会粘贴一些文本），选择一个自动完成选项，Linux风格的中间键单击粘贴，拖放以及许多其他操作。

请参见本页面并在此回答更多细节的意见。

oninput 事件对于跟踪输入字段的更改非常有用。

但是，在IE版本<9中不支持该功能。但是，较早的IE版本具有其自己的专有事件onpropertychange，该事件与相同oninput。

因此，您可以通过以下方式使用它：

$(':input').on('input propertychange');

拥有完整的跨浏览器支持。

由于可以为任何属性更改触发属性更改，例如，禁用的属性已更改，因此您需要包括以下内容：

$(':input').on('propertychange input', function (e) {
    var valueChanged = false;

    if (e.type=='propertychange') {
        valueChanged = e.originalEvent.propertyName=='value';
    } else {
        valueChanged = true;
    }
    if (valueChanged) {
        /* Code goes here */
    }
});

使用jQuery，以下效果是相同的：

$('a').click(function(){ doSomething(); });
$('a').on('click', function(){ doSomething(); });

input但是，对于该事件，在我测试过的浏览器中似乎只有第二种模式有效。

因此，您希望它可以正常工作，但它不起作用（至少当前如此）：

$(':text').input(function(){ doSomething(); });

同样，如果您想利用事件委托（例如，在将事件添加到DOM #container之前在上设置事件input.text），应该想到：

$('#container').on('input', ':text', function(){ doSomething(); });

再次遗憾的是，它目前无法正常工作！

仅此模式有效：

$(':text').on('input', function(){ doSomething(); });

使用更多当前信息进行编辑

我当然可以确认这种模式：

$('#container').on('input', ':text', function(){ doSomething(); });

现在，在所有“标准”浏览器中也可以使用。

正如claustrofob所说，IE9 +支持oninput。

但是，“ oninput事件在Internet Explorer 9中是错误的。仅当插入字符时才通过用户界面从文本字段删除字符时，不会触发该事件。尽管Internet Explorer 9支持onpropertychange事件，但与oninput事件，它也是越野车，在删除时不会触发。

由于可以通过几种方式删除字符（退格键和Delete键，CTRL + X，上下文菜单中的Cut和Delete命令），因此没有很好的解决方案来检测所有更改。如果通过上下文菜单的“删除”命令删除了字符，则无法在Internet Explorer 9的JavaScript中检测到该修改。”

对于输入和键输入（以及键按下，如果您希望在按住Backspace键的同时在IE中触发），我都有很好的效果。

使用输入时要小心。在IE 11中，此事件引发焦点和模糊。但是，在其他浏览器中发生更改时会触发此事件。

https://connect.microsoft.com/IE/feedback/details/810538/ie-11-fires-input-event-on-focus

我认为“输入”在这里的工作方式与“ oninput”在DOM级别O事件模型中的工作方式相同。

顺便：

就像Silkfire所说的那样，我也在Google搜索“ jQuery input event”。因此，我被引到这里，并惊讶地发现“输入”是jquery的bind（）命令可接受的参数。在jQuery in Action（p。102，2008 ed。）中，“输入”未提及为可能的事件（相对于其他20个事件，从“模糊”到“卸载”）。的确，在p。在图92中，可以推测出相反的情况是重新读取（即，通过引用级别0和级别2模型之间的不同字符串标识符）。这是相当误导的。

jQuery具有以下.on()方法签名：.on( events [, selector ] [, data ], handler )

事件可以是此参考中列出的任何事件：

https://developer.mozilla.org/zh-CN/docs/Web/Events

不过，并非所有浏览器都支持它们。

Mozilla针对输入事件陈述以下内容：

更改or元素的值时，将同步触发DOM输入事件。此外，更改内容时，它会在可编辑内容的编辑器上触发。

$("input#myId").bind('keyup', function (e) {    
    // Do Stuff
});

在IE和chrome中均可使用