javascript - jqueryを使用して複数のチェックボックスでチェックボックスの値の1つを取得する

Question

複数のチェックボックスからチェックボックスの値を取得しようとしています。以下のコードがあります。

 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="a" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="b" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="c" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="d" ng-model="todo.done">

私が欲しいもの：チェックボックスをオンにすると、チェックボックスの値が警告されます。私は以下のようなjqueryコードを持っています:

  $('input[type="checkbox"]').change(function() {
$('input[type="checkbox"]').each(function() {
    if ($(this).is(':checked')) {
    //the problem in here when I alert it will display many time with the other value of checkbox
    //what I need: I want to get only value of it when I check on it.
        alert($(this).prop('value'));
    }
});
});

誰でも親切に助けてください、ありがとう。

Answer 1

チェックボックス要素をループする必要はありません

$('input[type="checkbox"]').change(function () {
    if (this.checked) {
        alert(this.value);
    }
});

デモ:フィドル

Answer 2

これはこのように動作するはずです

$('input[type="checkbox"]').change(function() {
if ($(this).is(':checked')) {
        alert($(this).attr('value'));
    }
});

フィドル

Answer 3

OK、私はPHPで知っています。チェックボックスに同じ名前を付けたい場合は、それを配列に入れる必要があります

<input class="ng-pristine ng-valid" type="checkbox" name="ch[1]" value="a" ng-model="todo.done">

など、jqueryでも配列をループする必要があると確信しています。申し訳ありませんが、正確なコードはわかりません。:(

Answer 4

これを試して：

$('input[type="checkbox"]').click(function () {
     alert($(this).val());
});

Answer 5

jQuery関数をもっと調べてください...必要なのは、チェックボックスのイテレータとして動作し、そのチェックボックスを参照するために使用できる場所のような関数each内のパラメータだと思います。問題は、正確なチェックボックスを参照していないを使用しているためだと思います。eacheach(function(i,element) {})ielement(this)

私があなたを正しい方向に導いたことを願っています。

Answer 6

次のコードを試してください。あなたの $(this) は $('input[type="checkbox"]').each の要素を参照するため、すべてのチェックボックスで繰り返されます。これは変更 ではなく使用するのに適しているため、変更イベントをクリックに変更しました。

  $('input[type="checkbox"]').click(function() {

    if ($(this).is(':checked')) {
               alert($(this).val());
    }

 });

Answer 7

これを試して、

$(this).val();

その働き。