別のソースから取得した結果に基づいて動的に生成されるいくつかのテキストボックスがあります。これらのテキストボックスにいくつかのイベントハンドラを追加して、キーを押さえて、入力されたものがすべて数字であることを確認します。
私はこれらのテキストボックスをJSONレスポンス内の配列の長さに基づいて生成します:
for(i=0;i' + data.routesout[i].name + '(%)';
content += '<input type="text" name="route' + i + '" id="route' + i + '" value="' + data.routesout[i].percent>';
}
How can I attach a single event handler to all of these potential inputs?
開始日 セレクタを使用することができます
$('input[id^="route"]').keyup(function(){...
これらをオンザフライで作成する場合は、 ライブを使用してイベントを添付する必要があります。 em> :
$('input[id^="route"]').live('keyup', function(){...
あなたはjQueryを使って質問にタグを付けました。なぜあなたはコンテンツを構築するためにライブラリを使用していないのでしょうか?
var content = [];
for (var i = 0; i < data.routesout.length; ++i) {
content.push($('', { 'for': 'route' + i, text: data.routesout[i].name }));
content.push($('<input/>', { change: yourEventHandler, type: 'text', name: 'route' + i, id: 'route' + i, value: date.routesout[i].percent, change: yourEventHandler }));
}
このようにすることで、ハンドラ要素を構成するときにハンドラ要素を要素ごとバインドできます。 (私は "変更"を例として使用しましたが、同じ方法で必要なイベントのハンドラをバインドすることができます)。
最後に、作成した要素をすべて追加することもできますし、配列を作成する代わりに追加することもできます。
これはどうですか?
for(i=0;i' + data.routesout[i].name + '(%)';
content += '<input onkeypress="doSomething(this)" type="text" name="route' + i + '" id="route' + i + '" value="' + data.routesout[i].percent + '>';
}
function doSomething(element){
/* this function will be called when user presess key inside a textbox */
}