input field "onchange" event jquery

Question

<input type="text" id="myinput" name="myinput" value="" />

how do i use jquery to detect the "onchange" event of the input field.I tried everything but nothing seems to fire it.

$("#myinput").bind("onchange",alert("test"));
$("#myinput").change(alert("test"));

im using jquery 2.03.Its the "onchange" aka once the user finishes typing then fire event.Not fire after each letter changed, because im getting json from the server and it would cause a tremendous load if it where to call on each letter change.

as paul said this is the solution i guess..thx alot

http://jsfiddle.net/kerc6/5/

Possible duplicat [Jquery: how to detect a textbox's content has changed](http://stackoverflow.com/questions/1481152/jquery-how-to-detect-a-textboxs-content-has-changed) — Vucko, Jan 04 '14 at 13:06
It should definitely work. Check in fiddle **(http://jsfiddle.net/kerc6/1/)** — Rajesh Paul, Jan 04 '14 at 13:37

Roko C. Buljan · Answer 1 · 2014-01-04T13:12:46.310

3

Use the .on() method, create a function handler and do stuff inside.

jQuery(function( $ ){ // DOM is now ready

    $("#myinput").on("input", function(){ // or use "change" if you need
      // DO SOMETHING
    });

});

The other way:

function inputChangeStuff(){
    // DO SOMETHING
}

jQuery(function( $ ){ // DOM is now ready    
    $("#myinput").on("input", inputChangeStuff);     
});

edited Jan 04 '14 at 13:12

answered Jan 04 '14 at 13:07

Roko C. Buljan

196,159
39
305
313

those dont do nothing, im using 2.03, once i change a letter it fires but i want onchange event. – Aflred Jan 04 '14 at 13:16
@Aflred did you read my answer? You probably missed the part `// or use "change" if you need` And how does the accepted answer differs from mine? – Roko C. Buljan Jan 04 '14 at 15:05
calm down i didnt read that my mystake.Sorry i upvoted ur answer. – Aflred Jan 04 '14 at 15:56

Rajesh Paul · Accepted Answer · 2014-01-04T13:22:18.763

If you expect it to fire on each keypress then you are wrong. It will automatically fire when the focus is out of the element.

It occurs instantly only for elements like radio-button, checkbox.

For your specific purpose define jquery event input as follows:

$("input").on('input', function(){alert(1)});

N.B. this works only for textual input elements for instant change detection. Most importantly, it detects any type of change i.e. through either keyboard or mouse

Fiddle

score 1 · Answer 3 · answered Jan 04 '14 at 13:18

By using keyup down you can also track it:

  <script>
   $(document).ready(function(){
   $("#myinput").keydown(function(){
    $("#myinput").css("background-color","yellow");
   });
   $("#myinput").keyup(function(){
    $("#myinput").css("background-color","pink");
   });
 });
</script>

input field "onchange" event jquery

3 Answers3