jquery - jQueryでチェックボックスがチェックされた後にテキストフィールドを表示する

Question

次のように、フィルター付きの div が 1 つあります: (チェックボックスのクラス名は => dynamicFilterInput )

[ ] all product
[ ] bmw
[ ] mercedes
[x] audi

複数のチェックボックスがオンになっている場合、テキストは次の<div>ように別のチェックボックスに表示される必要があります。

選択したフィルター:

• アウディ
のチェックをすべて外します

私はそれを行う方法がわかりません、私はこれを試しました:

$(".dynamicFilterInput").on( "click", function() {
    $( "#tabs_pieces_select" ).html( $("input:checked").val() + " is checked!" );
});

しかし、うまくいきません。コンソールに次のエラーが表示されます。

TypeError: $(...).on は関数ではありません

ご協力いただきありがとうございます。

score 2 · Accepted Answer

バージョン 1.4.2 では、'delegate'/'bind' を使用します。実際、チェックボックスを動的に追加しない場合は、on/delegate/bind を使用する必要はありません。単純なクリックで十分です。

$(".dynamicFilterInput").click(function() { 
 $("#tabs_pieces_select").html($(this).val() + " ::: is checked");
});

上記のコードは、単純にクリック機能を使用するために使用されます。

score 1 · Accepted Answer

これを試して：

$(".dynamicFilterInput").click(function () {
    if (this.checked) $("#tabs_pieces_select").html($(this).val() + " is checked!");
});

この関数は、チェックボックスをオンにするかオフにするかに関係なく常に呼び出されるため、チェックボックスがクリックされてオンになったときに、テキストのみが別の div に表示されるようにする必要があります。

score 1 · Accepted Answer

これをチェックできますhttp://jsfiddle.net/5KdfB/

基本的に、以下のコードは何とか機能しますが、いくつかの小さな問題があります。

$(".dynamicFilterInput").click(function() { $( "#tabs_pieces_select" ).html( $("input:checked").val() + "チェック済み!" );

これは、チェックされた最初の入力チェックボックスのみを投稿しますが、2 つ以上のチェックボックスをチェックするとどうなるでしょうか...コードは最初の入力チェックボックスのみを表示します。

$('.dynamicFilterInput').on('click', function() { var choice = $(this);

if (choice.is(":checked"))
{
    $('#choices' ).append( choice.val()  + " is checked!" );
}

});

お役に立てれば

score 0 · Accepted Answer

.live()を使用する

$(".dynamicFilterInput").live("click", function() {
    $("#tabs_pieces_select").html($("input:checked").val()
            + " is checked!");
});

4 に答える 4