jQuery 文本框更改事件在文本框失去焦点之前不会触发?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17317465/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery textbox change event doesn't fire until textbox loses focus?
提问by SNag
I found that jQuery change event on a textbox doesn't fire until I click outside the textbox.
我发现文本框上的 jQuery 更改事件在我单击文本框外部之前不会触发。
HTML:
HTML:
<input type="text" id="textbox" />
JS:
JS:
$("#textbox").change(function() {alert("Change detected!");});
See demo on JSFiddle
My application requires the event to be fired on every character change in the textbox. I even tried using keyup instead...
我的应用程序要求在文本框中的每个字符更改时触发该事件。我什至尝试使用 keyup 代替...
$("#textbox").keyup(function() {alert("Keyup detected!");});
...but it's a known fact that the keyup event isn't fired on right-click-and-paste.
...但众所周知,keyup 事件不会在右键单击并粘贴时触发。
Any workaround? Is having both listeners going to cause any problems?
任何解决方法?有两个听众会引起任何问题吗?
回答by Petah
Binding to both events is the typical way to do it. You can also bind to the paste event.
绑定到这两个事件是典型的方法。您还可以绑定到 paste 事件。
You can bind to multiple events like this:
您可以像这样绑定到多个事件:
$("#textbox").on('change keyup paste', function() {
console.log('I am pretty sure the text box changed');
});
If you wanted to be pedantic about it, you should also bind to mouseup to cater for dragging text around, and add a lastValue
variable to ensure that the text actually did change:
如果你想学究它,你还应该绑定到 mouseup 以适应拖动文本,并添加一个lastValue
变量以确保文本确实发生了变化:
var lastValue = '';
$("#textbox").on('change keyup paste mouseup', function() {
if ($(this).val() != lastValue) {
lastValue = $(this).val();
console.log('The text box really changed this time');
}
});
And if you want to be super duper
pedantic then you should use an interval timer to cater for auto fill, plugins, etc:
如果你想super duper
学究,那么你应该使用间隔计时器来满足自动填充、插件等的需求:
var lastValue = '';
setInterval(function() {
if ($("#textbox").val() != lastValue) {
lastValue = $("#textbox").val();
console.log('I am definitely sure the text box realy realy changed this time');
}
}, 500);
回答by A. Wolff
On modern browsers, you can use the input
event:
在现代浏览器,就可以使用该input
事件:
$("#textbox").on('input',function() {alert("Change detected!");});
回答by Tony Dong
$(this).bind('input propertychange', function() {
//your code here
});
This is works for typing, paste, right click mouse paste etc.
这适用于打字、粘贴、右键单击鼠标粘贴等。
回答by Milan
if you write anything in your textbox, the event gets fired.
code as follows :
HTML:
HTML:
<input type="text" id="textbox" />
JS:
JS:
<script type="text/javascript">
$(function () {
$("#textbox").bind('input', function() {
alert("letter entered");
});
});
</script>
回答by Dhaval Marthak
Try this:
尝试这个:
$("#textbox").bind('paste',function() {alert("Change detected!");});
See demo on JSFiddle.
请参阅JSFiddle 上的演示。
回答by Venkat.R
Try the below Code:
试试下面的代码:
$("#textbox").on('change keypress paste', function() {
console.log("Handler for .keypress() called.");
});
回答by Kevin Sebastian Fernandez
Reading your comments took me to a dirty fix. This is not a right way, I know, but can be a work around.
阅读您的评论使我陷入了困境。这不是正确的方法,我知道,但可以解决。
$(function() {
$( "#inputFieldId" ).autocomplete({
source: function( event, ui ) {
alert("do your functions here");
return false;
}
});
});