在看到这个jsfiddle之前,我从未听说过jQuery中有一个事件叫做input。
你知道为什么有用吗?是keyup的别名吗?
$(document).on('input', 'input:text', function() {});
在看到这个jsfiddle之前,我从未听说过jQuery中有一个事件叫做input。
你知道为什么有用吗?是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');
有一个完整的跨浏览器支持。
因为任何属性更改都可以触发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事件模型中的工作方式相同。
顺便说一下:
Just as silkfire commented it, I too googled for 'jQuery input event'. Thus I was led to here and astounded to learn that 'input' is an acceptable parameter to jquery's bind() command. In jQuery in Action (p. 102, 2008 ed.) 'input' is not mentionned as a possible event (against 20 others, from 'blur' to 'unload'). It is true that, on p. 92, the contrary could be surmised from rereading (i.e. from a reference to different string identifiers between Level 0 and Level 2 models). That is quite misleading.
正如claustrofob所说,IE9+支持oninput。
但是,“oninput事件在ie9中有bug。当通过用户界面从文本字段中删除字符时,只有在插入字符时才会触发它。虽然Internet Explorer 9支持onpropertychange事件,但与oninput事件类似,它也有bug,在删除时不会触发。
由于字符可以通过多种方式删除(退格键和删除键,CTRL + X,上下文菜单中的剪切和删除命令),因此没有很好的解决方案来检测所有更改。如果使用上下文菜单的Delete命令删除字符,则无法在ie9的JavaScript中检测到修改。”
我有很好的结果绑定到输入和键下(和键下,如果你想让它在IE中,同时按住退格键)。
使用jQuery,以下是相同的效果:
$('a').click(function(){ doSomething(); });
$('a').on('click', function(){ doSomething(); });
然而,对于输入事件,似乎只有第二种模式在我测试的浏览器中有效。
因此,你会期望这个工作,但它没有(至少目前):
$(':text').input(function(){ doSomething(); });
同样,如果你想利用事件委托(例如在输入之前在#容器上设置事件)。text被添加到DOM),这应该会出现在脑海中:
$('#container').on('input', ':text', function(){ doSomething(); });
可悲的是,再次,它不工作目前!
只有这个模式有效:
$(':text').on('input', function(){ doSomething(); });
编辑了更多的最新信息
我可以肯定这种模式:
$('#container').on('input', ':text', function(){ doSomething(); });
NOW也适用于所有“标准”浏览器。
jQuery为.on()方法提供了以下签名:.on(events [, selector] [, data], handler)
事件可以是引用中列出的任何一个:
https://developer.mozilla.org/en-US/docs/Web/Events
但是,并不是所有浏览器都支持它们。
关于输入事件,Mozilla声明如下:
的值时同步触发DOM输入事件 或者元素被改变了。此外,它会继续发射 当内容发生变化时,可内容编辑器。
使用INPUT时要小心。在ie11中,此事件在聚焦和模糊时触发。但在其他浏览器中,更改会触发它。
https://connect.microsoft.com/IE/feedback/details/810538/ie-11-fires-input-event-on-focus