How to handle or track multiple events in a text field (made by other onchange, onblur, onclick elements)

Question

I have text fields Area, length, height, e.g.

[spinner BTN-A(+)] 
     <input type="text" name="total_area" id="abc" value="0"> 
[spinner BTN-A (-)]

[spinner BTN-B (-)]
         <input type="text" name="height" id="height" value="0">
[spinner BTN-B (-)]

[spinner BTN-C (-)]
        <input type="text" name="width" id="width" value="0">
[spinner BTN-C (-)]

Here [spinner BTN-{A|B|C} (+|-)]is a direct HTML button that increases / decreases the value of the text field by 1. (0 when loading)

I want to get the values ​​of all text fields. for this I run a generic function calculate()using jquery trigger,

function calculate() {
  //javascript Code to calculate area
}

In existing code, I use onchange, onblur, onclick and many more events to check if there is a change in the values ​​of the text fields.

Is it possible to write a generic trigger in jquery that processes all changes in specific text blocks regardless of whether this event changes (onchange, onblur, onclick)?

Answer 1

$('input[type="text"]').on('input', function() {
       // the code here will execute whenever a value changes
});

, onclick , , :

$('input[type="text"]').on('input click', function() {
       // will execute on value change + onclick
});

Answer 2

jQuery on, : https://api.jquery.com/on/

: .on( [, ] [, ], ) : , , , "click" "keydown.myPlugin".

: $ ( "enter" ). on ( " ", _);