jQuery execute function when input is changed or select is changed

Question

I have to change a function. Actually, it executes some lines of code whenever an input field is changed. I need to change the function that it executes whenever an input field has changed a value in a select field is changed. How can I combine this?

My function right now:

$("input").bind('keyup mouseup', function () {
   ....some lines of code
}

Possible duplicate of [jQuery multiple events to trigger the same function](https://stackoverflow.com/questions/2534089/jquery-multiple-events-to-trigger-the-same-function) — dustytrash, Sep 24 '18 at 13:08
Also .bind is deprecated, use .on - and .on("input" is a great event handler — mplungjan, Sep 24 '18 at 13:11

Hassan Sadeghi · Answer 1 · 2018-09-24T16:25:24.897

You can try this:

$(function(){
   var DoOnChange=function(){
         console.log($(this).val());
   };
   $("input#inp").on("keyup",DoOnChange);
   $("select#sl").on("change",DoOnChange);
});

And if you like using pure js and a legible code, look at code below:

window.onload=function(){
  var DoOnChange=function(ev){
      var el=ev.target;
      console.log(el.value);
  };
  document.querySelector("select#sl").addEventListener("change",DoOnChange);
  document.querySelector("input#inp").addEventListener("keyup",DoOnChange);
};

Or if you need change event:

$(function(){
      $("input,select").on("change",function(){
         console.log($(this).val());
     });
});

These codes works fine with html code like this:

<input type="text" id="inp"/>
<select id="sl">
    <option>1</option>
    <option>2</option>
</select>

I'm typing with my mobile phone and I haven't access to the code tools of stackoverflow now, but if you want, you can check the result online.

jQuery execute function when input is changed or select is changed

1 Answers1