0

私は他の同様の質問を見ましたが、それは私を助けませんでした。ラジオボタンを青に選択したときに、テーブル行の背景色を変更したい。別のラジオボタンをクリックすると、もう一方を通常に戻し、クリックして青色に変更します。今のところ、ラジオボタンを選択すると、ホバーのように機能し、マウスを離すとすぐに行が青になり、元の色に戻ります。ホバーしてクリックできるようにしたい：

     <script>
    $(document).ready(function () {
    $("tr").not(':first').hover(
      function () {
        $(this).css("background","lightblue");
      }, 
      function () {
        $(this).css("background","");
      }
    );


    $('input:radio').change(function () {
        $(this).closest('tr').siblings().css('background-color', 'white')
                     .end().css('background-color', 'darkblue');
    });

    });

</script>
4

2 に答える 2

1

これを試して：

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

</head>

<body>

<table>
<tr><td><input class="rad" type="radio" name="blah" value="1"/>One</td></tr>
<tr><td><input class="rad" type="radio" name="blah" value="2"/>Two</td></tr>
<tr><td><input class="rad" type="radio" name="blah" value="3"/>Three</td></tr>
</table>

</body>

</html>

<script type="text/javascript">
$("tr").not(':first').hover(
function () {
if($(this).css("background-color") != 'darkblue'){
$(this).css("background","lightblue");
}
}, 
function () {
if($(this).css("background-color") != 'darkblue'){
$(this).css("background","");
}
}
);
$(".rad").unbind("click").click(function(){
$('tr').css('background-color', 'white');
$(this).closest('tr').css('background-color', 'darkblue');
});
</script>
于 2012-05-21T19:33:32.883 に答える
1 
$('input:radio').change(function () {
    var parentTr = $(this).closest('tr');
    parentTr.siblings().css('background-color', 'white');
    parentTr.css('background-color', 'darkblue');
});

次のものも使用できますend。

$('input:radio').change(function () {
    $(this).closest('tr').siblings().css('background-color', 'white')
                         .end().css('background-color', 'darkblue');
});

しかし、それは通常、読みやすく維持するのがより困難です。

  • css をインラインで変更するのではなく、css クラスを使用することをお勧めします。
于 2012-05-21T18:55:41.527 に答える