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?
This question is related to
jquery
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:
$("input").bind({
paste : function(){
$('#eventresult').text('paste behaviour detected!');
}
})
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());
});
You can do this using jQuery's .bind()
method. Check out the jsFiddle.
Html
<input id="myTextBox" type="text"/>
jQuery
$("#myTextBox").bind("change paste keyup", function() {
alert($(this).val());
});
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
});
This combination of events worked for me:
$("#myTextBox").on("input paste", function() {
alert($(this).val());
});
$("#myTextBox").on("change paste keyup select", function() {
alert($(this).val());
});
select for browser suggestion
Use this: https://github.com/gilamran/JQuery-Plugin-AnyChange
It handles all the ways to change the input, including content menu (Using the mouse)
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
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.
Source: Stackoverflow.com