[英]How to fire JQuery change event when input value changed programmatically?
I want to fire the JQuery change
event when the input text is changed programmatically, for example like this:我想在以编程方式更改输入文本时触发 JQuery
change
事件,例如:
$("input").change(function(){ console.log("Input text changed!"); }); $("input").val("A");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type='text' />
But it doesn't work.但它不起作用。 How can I make this work?
我怎样才能使这项工作?
change event only fires when the user types into the input and then loses focus.
仅当用户输入输入然后失去焦点时才会触发更改事件。
You need to trigger the event manually using change()
or trigger('change')
您需要使用
change()
或trigger('change')
手动触发事件
$("input").change(function() { console.log("Input text changed!"); }); $("input").val("A").change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type='text' />
The event handler .change()
behaves like a form submission - basically when the value changes on submit the console will log.事件处理程序
.change()
行为类似于表单提交 - 基本上当提交时的值更改时,控制台将记录。 In order to behave on text input you would want to use input, like below:为了对文本输入进行操作,您需要使用输入,如下所示:
$("input").on('input', function(){ console.log("Input text changed!"); }); $("input").val("A");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type='text' />
What you need to do is trigger the change
event after you've set the text.您需要做的是在设置文本后触发
change
事件。 So you may create a function to do that so you won't have to repeat it every time you need to update the text, like this:因此,您可以创建一个函数来执行此操作,这样每次需要更新文本时就不必重复它,如下所示:
function changeTextProgrammatically(value) {
$("input").val( value );
$("input").trigger( 'change' ); // Triggers the change event
}
changeTextProgrammatically( "A" );
You can use the DOMSubtreeModified event:您可以使用 DOMSubtreeModified 事件:
$('input').bind('DOMSubtreeModified',function(){...})
If you want to fire both user and code changes:如果你想火用户和代码更改:
$('input').bind('input DOMSubtreeModified',function(){...})
This event is marked as deprecated and sometimes quite CPU time consuming, but it may be also very efficient when used carefully...此事件被标记为已弃用,有时会占用大量 CPU 时间,但如果小心使用,它也可能非常有效...
jquery change event only works when the user types into the input and then loses focus. jquery change 事件仅在用户输入输入然后失去焦点时才起作用。 So you can use the following workaround to do so:- Let's say you have a button clicking on which results in change in value of input.
因此,您可以使用以下解决方法来执行此操作:- 假设您单击了一个按钮,该按钮会导致输入值发生变化。 (this could be anything else as well instead of a button)
(这也可以是其他任何东西,而不是按钮)
var original_value = $('input').val();
$('button').click(function(){
var new_value = $('input').val();
if(original_value != new_value ){
//do something
}
//now set the original value to changed value (in case this is going to change again programatically)
original_value = new_value;
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.