web-dev-qa-db-ja.com

クラス名JQueryでIDを取得

こんにちは、これはjquery質問です：

私がこれを持っていると仮定します：

<input type="checkbox" class="select" id ="select-1">

<input type="checkbox" class="select" id ="select-2">

そして、私はチェックボックスのIDを取得送信ボタンをクリックしたときに選択された（注：あなたは1つしか選択できません）、私はこのボタンクリックイベントをここに持っています：

$("#submit").click(function(){

          if($(".select").is(':checked')){

              alert($(".select").attr('id'));
          }
});

それは常に "select-1"を警告します "select-2" idのチェックボックスを選択した場合でも..それらは両方とも同じクラスにあり、 "検出される.select」クラスがアラートに表示されます。クラス名を使用してチェックされる特定のIDを取得するにはどうすればよいですか？ありがとうございました！

javascriptjqueryclassinputcheckbox
10
muffin

一度に1つのチェックボックスのみをチェックしていますか？

alert( $(".select:checked").attr('id') );

または、複数のチェックボックスを一度にチェックする場合：

$(".select:checked").each(function(){
   alert($(this).attr('id'));
});

デモ： http://jsfiddle.net/UTux2/

34
Cristy

この方法を使用してIDを取得する

$(".select:checked").attr('id');

また、1つしか選択できない場合は、radioに変更することをお勧めします。

3
Elon Than

チェックされたチェックボックスをキャプチャしておらず、「チェックされているものはありますか？」.

$("#submit").click(function(){

    var elem = $(".select:checked");

    if(elem.length > 0){
        alert(elem.attr('id'));
    }
});
2
MrCode
$("#submit").click(function(){  
          if($(".select").is(':checked')){
               var $this=$(".select").is(':checked');
               alert($this.attr('id'));
          }
});
2
Somnath Kharat

複数の要素があります。同じクラスを持つすべてのチェックボックスをチェックする必要があります

$("#submit").click(function(){

          $(".select:checked").each(function(){
           alert($(this).attr('id'));
   });

});
2
sudhAnsu63

多くの選択肢から1つを選択するには、チェックボックスではなくラジオボタンを使用する必要があります。

<input type="radio" name="select" value="select-1">
<input type="radio" name="select" value="select-2">

その後、物事は本当に簡単になります：

$("#submit").click(function(){

    alert($('[name="select"]:checked').val());
});
2
Dementic

このようなことを試してください、あなたは反復する必要はありません

        $(document).ready(function () {
            $("#submit").click(function(){
                  if($(".select").is(':checked')){
                      alert($(".select:checked").attr('id'));
                  }
            });
        });
0
rajesh kakawat