0

ボタンを表す画像のクリックを処理するコードがあります。その画像をクリックすると、対応する画像がユーザーに表示されます。画像の複数の ID を選択することにより、以下の vode は完全に正常に機能します。

$("#content").on('click','#buttonID1, #buttonID2, #buttonID3, #buttonID4', function(){
    var $varThis = $(this);
    var tmpID = $varThis.prop('id').split('ID')[1];         
    $('#imageID'+tmpID).css({'display': 'block'});
});

ただし、これらの ID をさらに多く選択する必要があります。画像を単一の変数に格納し、#buttonIDその変数を.on()メソッド内に配置することは可能ですか? それらは独立して選択されますか？

以下のコードは機能しません。

var $buttons = $('#buttonID1, #buttonID2, #buttonID3, #buttonID4');
$("#content").on('click',$buttons, function(){
     var $varThis = $(this);
     var tmpID = $varThis.prop('id').split('ID')[1];            
     $('#imageID'+tmpID).css({'display': 'block'});
});
4

3 に答える 3

4

これはクラスの目的ではありませんか？クラスを追加し、それmyButtonをすべてのボタンに呼び出して、それをセレクターとして使用しましょう。

$("#content").on('click','.myButton', function(){

または、IDの使用を主張する場合、これは機能するはずです。

var buttons = '#buttonID1, #buttonID2, #buttonID3, #buttonID4';
$("#content").on('click',buttons, function(){
于 2012-11-21T16:16:41.917 に答える
3

変化する

var $buttons = $('#buttonID1, #buttonID2, #buttonID3, #buttonID4');

To

var $buttons = '#buttonID1, #buttonID2, #buttonID3, #buttonID4';

  $("#content").on('click',$buttons, function(){
        var $varThis = $(this);
        var tmpID = $varThis.prop('id').split('ID')[1];         
        $('#imageID'+tmpID).css({'display': 'block'});
    });
于 2012-11-21T16:17:03.487 に答える
2

そのためには、css attribute-starts-with セレクターを使用する必要があります。

$("#content").on('click','button[id^="buttonID"]', function(){
 ...
}
于 2012-11-21T16:43:28.830 に答える