0

ここに2つのjqueryコードがあります

コード1

$(document).ready(function() { 
    $("div.imgDisp").hide();
    $('[id="' + $(":radio:checked").val()+'"]').show();
    $(":radio").click(function() {      
        $("div.imgDisp").fadeOut('slow');
        $('[id="' + $(this).val()+'"]').fadeIn('slow');
    });
});

このコードは、ラジオボタンを選択する際にdivを非表示にします。このフィドルを確認してくださいhttp://jsfiddle.net/nanoquantumtech/qudT2/3/

このフィドルでは、name="type"の下にあるラジオのセットを見ることができます。ここまではすべてうまくいきます。

別の名前で他のラジオボタンのセットもあります。問題は、異なる名前でこれらのラジオボタンのいずれかをクリックすると、このフィドルコードとは関係ありませんが、クリックするとこのフィドルの効果が無効になることです。そして、このフィドルの望ましい効果はちょうど消えます。つまり、フィドルに表示されているもの以外のラジオボタンをクリックすると、表示された結果が非表示になり、フィドルの結果は画面に表示されたままになります。びっくりしました。

同じ問題は、テキストファイルを表示/非表示にするために使用した別のjqueryコードにもあります。[別のコードを省略した場合、問題はそのコードでも同じです]

何が間違っている可能性がありますか？前もって感謝します..

4

1 に答える 1

3

ここでの問題は、すべての無線に対してクリックイベントを呼び出していることです。つまり$(":radio").click(function() { ..、クリックイベントをその無線のみに指定しますname="type"。

$('input[name="type"]:radio').click(function() {.... });

これを試して

$('input[name="type"]:radio').click(function() {
    $("div.imgDisp").fadeOut('slow');
    $('[id="' + $(this).val()+'"]').fadeIn('slow');
});

これは、name="type"とradioの入力に対してのみクリックイベントを呼び出します。

ここをいじる

于 2013-02-12T08:07:09.710 に答える