функция для получения значения и идентификатора формы ввода на основе пользовательского ввода в Javascript

Question

У меня есть несколько входов.Когда пользователь вводит что-то во ввод, я хочу получить его значение и идентификатор, используя функцию.Какой лучший способ сделать это?

<input type="number" class="form-control" id="id1">
<input type="number" class="form-control" id="id2">
.
.
<input type="number" class="form-control" id="id9">
<input type="number" class="form-control" id="id10">



<script>
function getIdVal(){
// how to get those values and ids from this function?
}
</script>

Answer 1

попробуйте это.всякий раз, когда вы что-то печатаете (включая backspace), запускается событие key onkeyup и вызывается функция getIdVal.

<input type="number" class="form-control" onkeyup="getIdVal(this)" id="id1">
<input type="number" class="form-control" onkeyup="getIdVal(this)" id="id2">
.
.
<input type="number" class="form-control" onkeyup="getIdVal(this)" id="id9">
<input type="number" class="form-control" onkeyup="getIdVal(this)" id="id10">



<script>
function getIdVal(obj) {
    // how to get those values and ids from this function?
    console.log(obj.id)
    console.log(obj.value)
}
</script>

Answer 2

<input type="text" id="fname1" onkeyup="myFunction('fname1');">
<input type="text" id="fname2" onkeyup="myFunction('fname2');">

 function myFunction(ids) {
    var x = document.getElementById(ids);
   alert("Value: "+x.value  + "  ID: "+x.id);

}

Answer 3

Используя событие change/keyup/keydown (которое при необходимости можно заменить другим событием), вы можете сделать что-то вроде этого:

<input type="number" class="form-control" onchange="run(this)" id="id1">
<input type="number" class="form-control" onchange="run(this)" id="id2">

<input type="number" class="form-control" onchange="run(this)" id="id9">
<input type="number" class="form-control" onchange="run(this)" id="id10">

И для вашего JS

function run(ele){
  var id = ele.id;
  var value = ele.value;
  console.log(id, value);
}

Вот JSFiddle .