jQuery & # 39;输入# 39;事件

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

你知道为什么有用吗?它是keyup的别名还是什么?

$(document).on('input', 'input:text', function() {});
343815 次浏览
小开
最佳答案

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

它不是keyup的别名，因为即使键不执行任何操作，keyup也会触发(例如:按下然后释放Control键将触发keyup事件)。

考虑它的一个好方法是这样的:它是一个每当输入发生变化时就会触发的事件。这包括——但不限于——按下修改输入的键(因此，例如，Ctrl本身不会触发事件，但Ctrl-V粘贴一些文本会触发事件)，选择自动完成选项，linux风格的中键粘贴，拖放和许多其他事情。

查看这页面和这个答案的评论了解更多细节。

小开

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

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

所以你可以这样用:

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

有一个完整的跨浏览器支持。

因为任何属性更改都可以触发propertychange，例如，disabled属性被更改，那么你想要做的是:

$(':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 */
}
});
小开

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

顺便说一下:

就像silkfire评论的那样，我也谷歌了“jQuery输入事件”。因此，我被引导到这里，并惊讶地了解到'input'是jquery的bind ()命令的可接受参数。 在jQuery实用化 (p. 102, 2008版。)“输入”没有被提到作为一个可能的事件(相对于其他20个事件，从“模糊”到“卸载”)。的确，在第92页，通过重读(即从0级和2级模型之间对不同字符串标识符的引用)可以推测出相反的情况。这是一种误导。< / p >
小开

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

然而， " oninput事件在ie9中有bug。当通过用户界面从文本字段中删除字符时，只有在插入字符时才会触发它。虽然Internet Explorer 9支持onpropertychange事件，但与oninput事件类似，它也有bug，在删除时不会触发。

由于字符可以通过多种方式删除(退格键和删除键，CTRL + X，上下文菜单中的剪切和删除命令)，因此没有很好的解决方案来检测所有更改。如果使用上下文菜单的Delete命令删除字符，则无法在ie9的JavaScript中检测到修改。”

我有很好的结果绑定到输入和键下(和键下，如果你想让它在IE中，同时按住退格键)。

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

可以在IE和chrome浏览器中工作

小开

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

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

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

因此，你会期望这个工作，但它没有(至少目前):

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

同样，如果你想利用事件委托(例如，在你的input.text被添加到DOM之前在#container上设置事件)，应该想到:

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

可悲的是，再次，它不工作目前!

只有这个模式有效:

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

编辑了更多的最新信息

我可以肯定这种模式:

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

NOW也适用于所有“标准”浏览器。

小开

jQuery对.on()方法有以下签名

事件可以是引用中列出的任何一个:

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

但是，并不是所有浏览器都支持它们。

关于输入事件，Mozilla声明如下:

的值时同步触发DOM输入事件 或者元素被改变了。此外，它会继续发射

. contentteditable编辑器
小开

使用INPUT时要小心。在ie11中，此事件在聚焦和模糊时触发。但在其他浏览器中，更改会触发它。

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


提交答案