2

存在する電話番号の数に基づいて動的に作成されるいくつかのボタンがあります.DBに3つの名前があると仮定すると、3つのボタンが表示されます.1番目のボタンをクリックすると、最初のボタンの値が表示されます. 2番目がクリックされた場合、2番目のボタンの値が表示されます.これは私の要件について説明する単純なjsfiddleです.電話番号である必要がある別のIDを各ボタンに割り当てることを考えました.特定のボタンをクリックしているときにjsfiddleでアラートが表示されますが、値はありません。

私はこれが好きでした

$('.btn').click(function(){ 
var number1 = $('#s2').val();
alert(number1);
});
4

4 に答える 4

2

jQuery のon()メソッドを使用してイベント委任を使用する必要があります。そのドキュメントから：

セレクターが提供されている場合、イベント ハンドラーは委任されていると見なされます。イベントがバインドされた要素で直接発生した場合、ハンドラーは呼び出されませんが、セレクターに一致する子孫 (内部要素) に対してのみ呼び出されます。jQuery は、イベント ターゲットからハンドラーがアタッチされている要素 (つまり、最も内側の要素から最も外側の要素) までイベントをバブルし、セレクターに一致するそのパスに沿ったすべての要素に対してハンドラーを実行します。

あなたの場合、.btnその要素がページに動的に追加される前に存在する先祖にクリックイベントを委任する必要があります。

$('body').on('click', '.btn', function() {
    var number1 = $('#s2').val();
    alert(number1);
});

要素に近づくほど.btn良いので、ドキュメントbodyが最も近い非動的な祖先でない限り、これをもう少し近いものに変更する必要があります。

編集：コメントでさらに質問：

各ボタンの ID を取得できますか

id各ボタンのを取得するには、次を使用しthis.idます。

$('body').on('click', '.btn', function() {
    var id = this.id;
    alert(id);
});

編集2：コメントでさらに質問

私が言ったように、ID は数字です。したがって、button1 をクリックすると、入力フィールドに s1 が出力されます。方法を教えてください。

input「数値」があるため、idjQuery のメソッドを使用して、クリックしたボタン.val()の値を設定するだけです。inputid

$('body').on('click', '.btn', function(){ 
    $('#number').val(this.id);
});

ワーキング JSFiddle デモ。

于 2013-10-23T11:40:08.837 に答える
1

クリックされたボタンのIDを取得したい場合は、次を使用する必要がありますattr。

$('.btn').click(function(){ 
   var number1 = $('#s2').attr('id');
   alert(number1);
});
于 2013-10-23T11:56:56.223 に答える
1 
$(document).on('click', '.btn', function(){ 
   alert($(this).val()); 
});

動作するはずです。「オン」は、動的に配置された要素を操作する方法です。

于 2013-10-23T11:39:53.933 に答える
1

ボタン入力に値属性を入れる

  <button type="button" class="btn" value="test2" >test</button>
  <button type="button" class="btn" value="test1" id="s1">test</button>
  <button type="button" class="btn" value="test" id="s2">test</button>

そして、スクリプトを使用します

 $('.btn').on('click', function() {
       var number = $('#s2').val();//get value

 });
于 2013-10-23T11:56:22.413 に答える