ループ内で関数を呼び出す

Question

Javascriptを使用してループ内で関数を呼び出すことができるかどうかを質問したいと思います。

HTMLの「数字」入力を使わずにボタンを増減するテキストフィールドを作成したいと思います。

関数を1で正規化し、代わりにループを使用する簡単な方法はありますか？その後、

function increment(id) { 
    document.getElementById(id).stepUp(1); 
} 

と：：

関数にパラメータとしてIDを渡すことについて

function increment() { 
 
    document.getElementById("myNumber").stepUp(1); 
 
} 
 
function increment2() { 
 
    document.getElementById("myNumber2").stepUp(1); 
 
}

Number: <input type="number" id="myNumber"> 
 
<button onclick="increment()">+</button> 
 

 
Number: <input type="number" id="myNumber2"> 
 
<button onclick="increment2()">+</button>

Answer 1

どう

Number: <input type="number" id="myNumber"> 
<button onclick="increment('myNumber')">+</button> 

Number: <input type="number" id="myNumber2"> 
<button onclick="increment('myNumber2')">+</button> 

Answer 2

あなたが入力のidを渡すことができます関数呼び出し：

function increment(elem) { 
 
    document.getElementById(elem).stepUp(1); 
 
}

Number: 
 
<input type="number" id="myNumber"> 
 
<button onclick="increment('myNumber')">+</button> 
 

 

 
Number: 
 
<input type="number" id="myNumber2"> 
 
<button onclick="increment('myNumber2')">+</button>

Answer 3

他の回答確かに（例えば、」を参照してください。今のJavaScriptでイベントを処理するタスクを解決するため、しかし...非常に「onclickの」を使用することを推奨していないと同様の属性Why is using onClick() in HTML a bad practice? "）。

addEventListener('click', callback)は、コードがより保守性が高く、このようにクリアされているためです。

特定のタスクの例としてhttps://jsfiddle.net/zrx2xqgg/を参照してください。 入力のセレクタが属性としてボタンに渡されます。