jQuery的“input”事件
我从来没有听说过jQuery的一个事件叫做input
直到我看到这个jsfiddle 。
你知道为什么它的工作? 这是一个keyup
或什么别名?
$(document).on('input', 'input:text', function() {});
在通过用户界面更改元素的文本内容时发生。
这不是密钥的别名,因为即使密钥什么都不做(例如:按下然后松开Control键将触发按键事件), keyup
将会触发。
一个好的方法是这样的:只要input发生变化,就会触发一个事件。 这包括但不限于 – 按下修改input的键(例如, Ctrl
本身不会触发事件,但Ctrl-V
粘贴一些文本),select一个自动完成选项, Linux风格的中点击粘贴,拖放和其他许多事情。
有关更多详细信息,请参阅此页面和此答案的评论。
oninput
事件对跟踪input字段的变化非常有用。
但是,IE版本<9不支持。但是,较早的IE版本有自己的oninput
事件onpropertychange
,它和oninput
。
所以你可以这样使用它:
$(':input').on('input propertychange');
要有一个完整的交叉浏览器支持。
由于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
事件,只有第二个模式似乎可以在我testing过的浏览器中工作。
因此,你会期望这个工作,但它不(至less目前):
$(':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(); });
现在在所有“标准”浏览器中也可以运行。
正如claustrofob所说,IE9 +支持oninput。
但是 ,“oninput事件在Internet Explorer 9中是有问题的,只有在插入字符时才会通过用户界面从文本字段中删除字符,但不会触发。尽pipeonpropertychange事件在Internet Explorer 9中受支持,但类似于在input事件,它也是越野车,它不是在删除开除。
由于字符可以通过几种方式删除(Backspace和Delete键,CTRL + X,Cut和Delete命令在上下文菜单中),所以没有一个好的方法来检测所有的变化。 如果通过上下文菜单的删除命令删除了字符,则在Internet Explorer 9的JavaScript中将无法检测到修改。
我有很好的结果绑定到input和keyup(和keydown,如果你想要在IE中按住Backspace键触发)。
我认为“input”只是在DOM Level O事件模型中以“input”的方式工作。
顺便:
就像silkfire评论的那样,我也是为了“jQueryinput事件”而search的。 因此,我被带到这里,惊讶得知“input”是jQuery的bind()命令可接受的参数。 在jQuery in Action (第102页,2008年版)中,“input”没有被提及为一个可能的事件(相对于另外20个,从'blur'到'unload')。 这是事实,在第。 92,相反可以从重读(即从0级和2级模型之间的不同string标识符的引用)推测出来。 这是相当的误导。
使用INPUT时要小心。 这个事件在IE 11中引起焦点和模糊。但是在其他浏览器中发生变化时触发。
https://connect.microsoft.com/IE/feedback/details/810538/ie-11-fires-input-event-on-focus
jQuery对.on()
方法具有以下签名: .on( events [, selector ] [, data ], handler )
事件可以是此参考文献中列出的任何人:
https://developer.mozilla.org/en-US/docs/Web/Events
但是,并不是每个浏览器都支持它们。
Mozilla对input事件陈述如下:
当一个or元素的值被改变时,DOMinput事件被同步触发。 另外,它的内容改变时,它会引发内容可信的编辑。
$("input#myId").bind('keyup', function (e) { // Do Stuff });
在IE和Chrome中工作