0

最初に私の HTML がどのようなものかを理解してもらうために、ラジオ ボタンの 3 つのグループを含むページを用意しています。ラジオの各グループは、コンテナー (つまり、ページ 1、ページ 2、ページ 3) によって名前が付けられています。したがって、ラジオの最初のグループはすべて「page1」という名前を共有し、2 番目のグループは「page2」という名前を共有します。

そのため、jQuery を使用してラジオ ボタンとそのラジオを含むテーブルのクラスを切り替えています (つまり、addClass、removeClass on toggle)。トグルは正常に機能し、トグルでのクラスの追加と削除も同様です。私の問題は、page2 または page3 のラジオを選択してから、page1 のラジオを選択/再選択すると、jQuery が page2 および page3 のチェックされたラジオ スタイルのクラスを削除することです。

JSfiddle デモへのリンクは次のとおりです。

そして、私が使用しているjQueryを見てみましょう。

$(function() {

$('table').click(function(event) {
    $(this).closest('.container').addClass('selected').parent().siblings().each(function() {
        $(this).find('.container').removeClass('selected');
    });

    if(event.target.type != "radio") {

        var that = $(this).find('input:radio');

        that.attr('checked', !that.is(':checked'));

        if (that.is(':checked'))  {
        that.closest('table').addClass('selected');
    }
   else {
        that.closest('table').removeClass('selected');
}
    }
});
});
4

2 に答える 2

0

問題を解決することを追加すると、ページ1.parent().siblings()の周りがないため、他のページをピックアップしていますhttp://jsfiddle.net/5YnBq/1/div

于 2012-06-20T21:03:53.207 に答える
0

私はこれについて 100% ではありませんが、event.preventDefault(); を試してください。

私はそれが泡立っていると思うので、それがinput:radioをターゲットにするとき、それは最も外側のテーブルを使用するので、基本的にすべてのラジオボタンをターゲットにします。続行をクリックした後、フィドルが機能しなかったため、これをテストしていませんが、試してみて、何が起こるかを確認してください

于 2012-06-20T21:04:03.250 に答える