2

私がやりたいことは、選択したラジオボタンの親を強調表示できるようにすることです。私が問題を抱えているのは、選択されていないラジオから .sel クラスを削除することです。テーブルに複数のラジオ グループを設定し、各行に 1 つのグループを設定します。

これまでの私のコードは次のとおりです。

$(document).ready(function () {
$('td.radio').click(function () {
    $(this).children('input').prop('checked', true);

    if ($(this).children('input').is(':checked')) {
        $(this).addClass('sel');
    } else {
        $(this).removeClass('sel');
    }
});
});

これまでに管理したものを使用して、ここに jsFiddle をセットアップしました: http://jsfiddle.net/ASMITH/drYTP/5/

4

4 に答える 4

5

クリックされた td のすべての兄弟から sel クラスを削除し、クリックされたものに追加します。

    $('td.radio').click(function () {
        var $this = $(this);
        $this.children('input').prop('checked', true);       
        $this.siblings('td').removeClass('sel');        
        $this.addClass('sel');        
    });

http://jsfiddle.net/drYTP/6/

于 2013-05-08T20:17:13.333 に答える
1

私はお勧めします：

$('td.radio').removeClass('sel').filter(function(){
    return $(this).find('input:checked').length;
}).addClass('sel');

JS Fiddle のデモ(ページ読み込み時にデフォルトで2 つのradio要素があることに注意してください)。checked

より動的なアプローチの場合 (もともと、何らかの理由でページ読み込みイベントであると想定していました) を使用します。

$('input:radio').change(function(){
    $(this).closest('td').addClass('sel').siblings().removeClass('sel');
})

JS フィドルのデモ

于 2013-05-08T20:18:24.820 に答える
0

これをjsfiddleでテストしました。クリックされた行からのみハイライトを削除します。

$(document).ready(function () {
$('td.radio').click(function () {
    $(this).parent().children().each(function(){
        $(this).prop('checked', false);
        $(this).removeClass('sel');
    });
    $(this).children('input').prop('checked', true);
    $(this).addClass('sel');

});
});

編集 -

それがあなたが探していたものかどうかはわかりませんが、複数の行があるので、それがあなたが求めていたもののように見えました. http://jsfiddle.net/ASMITH/drYTP/5/

編集 2 --

いくつかのフォーマットを修正

于 2013-05-08T20:21:52.087 に答える