检测jQuery输入[type=text]的值变化

时间:2022-11-13 22:28:37

I want to execute a function every time the value of a specific input box changes. It almost works with $('input').keyup(function), but nothing happens when pasting text into the box, for example. $input.change(function) only triggers when the input is blurred, so how would I immediately know whenever a text box has changed value?

我想在每次特定输入框的值发生变化时执行一个函数。它几乎可以使用$('input').keyup(函数),但是当将文本粘贴到框中时不会发生任何事情,例如。$input.change(函数)只在输入被模糊时触发,所以当文本框改变值时,我如何立即知道?

8 个解决方案

#1


212  

just remenber that 'on' is recomended over the 'bind' function, so always try to use a event listener like this:

只要记住“on”是通过“bind”函数返回的,所以一定要使用这样的事件监听器:

$("#myTextBox").on("change paste keyup", function() {
   alert($(this).val()); 
});

#2


97  

Description

You can do this using jQuery's .bind() method. Check out the jsFiddle.

您可以使用jQuery的.bind()方法来实现这一点。查看jsFiddle。

Sample

Html

Html

<input id="myTextBox" type="text"/>

jQuery

jQuery

$("#myTextBox").bind("change paste keyup", function() {
   alert($(this).val()); 
});

More Information

#3


11  

Try this.. credits to https://*.com/users/1169519/teemu

试试这个. .学分到https://*.com/users/1169519/teemu

for answering my question here.. https://*.com/questions/24651811/jquery-keyup-doesnt-work-with-keycode-filtering?noredirect=1#comment38213480_24651811

感谢您回答我的问题。https://*.com/questions/24651811/jquery-keyup-doesnt-work-with-keycode-filtering?noredirect=1 comment38213480_24651811

This solution helped me to progress on my project.

这个解决方案帮助我在项目中取得进展。

$("#your_textbox").on("input propertychange",function(){

   // Do your thing here.
});

Note: propertychange for lower versions of IE.

注意:适用于较低版本的IE。

#4


5  

you can also use textbox events -

你也可以使用文本框事件。

<input id="txt1" type="text" onchange="SetDefault($(this).val());" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();">

function SetDefault(Text){
  alert(Text);
}

Try This

试试这个

#5


3  

Try this:

试试这个:

Basically, just account for each event:

基本上,只考虑每个事件:

Html:

Html:

<input id = "textbox" type = "text">

Jquery:

Jquery:

$("#textbox").keyup(function() { 
    alert($(this).val());  
}); 

$("#textbox").change(function() { 
alert($(this).val());  
}); 

#6


2  

Try this:

试试这个:

$("input").bind({
            paste : function(){
                $('#eventresult').text('paste behaviour detected!');
            }
})

#7


0  

Use this: https://github.com/gilamran/JQuery-Plugin-AnyChange

使用:https://github.com/gilamran/JQuery-Plugin-AnyChange

It handles all the ways to change the input, including content menu (Using the mouse)

它处理所有更改输入的方法,包括内容菜单(使用鼠标)

#8


0  

$("#myTextBox").on("change paste keyup select", function() {
     alert($(this).val());
});

select for browser suggestion

选择浏览器的建议

#1


212  

just remenber that 'on' is recomended over the 'bind' function, so always try to use a event listener like this:

只要记住“on”是通过“bind”函数返回的,所以一定要使用这样的事件监听器:

$("#myTextBox").on("change paste keyup", function() {
   alert($(this).val()); 
});

#2


97  

Description

You can do this using jQuery's .bind() method. Check out the jsFiddle.

您可以使用jQuery的.bind()方法来实现这一点。查看jsFiddle。

Sample

Html

Html

<input id="myTextBox" type="text"/>

jQuery

jQuery

$("#myTextBox").bind("change paste keyup", function() {
   alert($(this).val()); 
});

More Information

#3


11  

Try this.. credits to https://*.com/users/1169519/teemu

试试这个. .学分到https://*.com/users/1169519/teemu

for answering my question here.. https://*.com/questions/24651811/jquery-keyup-doesnt-work-with-keycode-filtering?noredirect=1#comment38213480_24651811

感谢您回答我的问题。https://*.com/questions/24651811/jquery-keyup-doesnt-work-with-keycode-filtering?noredirect=1 comment38213480_24651811

This solution helped me to progress on my project.

这个解决方案帮助我在项目中取得进展。

$("#your_textbox").on("input propertychange",function(){

   // Do your thing here.
});

Note: propertychange for lower versions of IE.

注意:适用于较低版本的IE。

#4


5  

you can also use textbox events -

你也可以使用文本框事件。

<input id="txt1" type="text" onchange="SetDefault($(this).val());" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();">

function SetDefault(Text){
  alert(Text);
}

Try This

试试这个

#5


3  

Try this:

试试这个:

Basically, just account for each event:

基本上,只考虑每个事件:

Html:

Html:

<input id = "textbox" type = "text">

Jquery:

Jquery:

$("#textbox").keyup(function() { 
    alert($(this).val());  
}); 

$("#textbox").change(function() { 
alert($(this).val());  
}); 

#6


2  

Try this:

试试这个:

$("input").bind({
            paste : function(){
                $('#eventresult').text('paste behaviour detected!');
            }
})

#7


0  

Use this: https://github.com/gilamran/JQuery-Plugin-AnyChange

使用:https://github.com/gilamran/JQuery-Plugin-AnyChange

It handles all the ways to change the input, including content menu (Using the mouse)

它处理所有更改输入的方法,包括内容菜单(使用鼠标)

#8


0  

$("#myTextBox").on("change paste keyup select", function() {
     alert($(this).val());
});

select for browser suggestion

选择浏览器的建议