Detecting value change of input[type=text] in jQuery

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?

Update - 2021

As of 2021 you can use input event for all the events catering input value changes.

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

Original Answer

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

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

Description

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

Sample

Html

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

jQuery

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

More Information

• jsFiddle Demonstration

• jQuery.bind()

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

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

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.

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

Try this:

Basically, just account for each event:

Html:

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

Jquery:

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

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

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

select for browser suggestion

DON'T FORGET THE cut or select EVENTS!

The accepted answer is almost perfect, but it forgets about the cut and select events.

cut is fired when the user cuts text (CTRL + X or via right click)

select is fired when the user selects a browser-suggested option

You should add them too, as such:

$("#myTextBox").on("change paste keyup cut select", function() {
   //Do your function 
});

Try this:

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

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

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

This combination of events worked for me:

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