Hello to all.

I have a form with three text fields. It is necessary when changing the values ​​of one form to read according to different formulas the values ​​of the others. Calculations must be done after entering each character - I want to use oninput.

How can I catch the oninput change event of each text field separately? At the moment I figured out how to catch a form event, but I need to know which text field was changed.

calc.oninput = function () { var lench = Number(document.getElementsByName('lench')[0].value); var widtch = Number(document.getElementsByName('widtch')[0].value); }; 

http://codepen.io/Korsic/pen/qNJqjA?editors=1010

    1 answer 1

    Like so

      var inp = document.querySelectorAll('input'); for (var i = 0; i < inp.length; i++) { inp[i].addEventListener('keyup', myfunc); } function myfunc() { var lench = +document.getElementsByName('lench')[0].value; document.getElementById('len').innerHTML = lench; var width = +document.getElementsByName('width')[0].value; document.getElementById('wid').innerHTML = width; } 
     <form name="calc"> <input type="text" name="lench"> <br /> <input type="text" name="width"> <br /> <input type="text" name="count"> <br /> </form> Lench: <div id="len"></div> Width: <div id="wid"></div>