單選按鈕改變表格行的背景顏色，當選擇另一個單選按鈕而沒有「懸停」干擾時恢復正常

我看了其他類似的問題，但它並沒有幫助我當我想改變表格行的背景顏色時我選擇單選按鈕爲藍色，當我點擊另一個單選按鈕時，我希望另一個單選按鈕變回正常狀態，點擊我的按鈕變成藍色。到目前爲止，當我選擇一個單選按鈕時，它就像懸停並使。該行的藍色，只要我移動鼠標離開，又回到原來的顏色我想能夠懸停，然後點擊：單選按鈕改變表格行的背景顏色，當選擇另一個單選按鈕而沒有「懸停」干擾時恢復正常

 <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>

來源

2012-05-21 Yusuf

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

您CA n您還可以使用end：

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

但它通常是難以閱讀和維護。

請注意，您最好使用css類而不是更改css內聯。

來源

2012-05-21 18:55:41 gdoron

IM不理解到我添加此功能或更換礦山 – Yusuf

@ user1392576。更換。 – gdoron

它給我同樣的問題..當我點擊單選按鈕時，我希望它保持藍色，即使我將鼠標移開，直到我點擊另一個單選按鈕。你給我的第一個代碼通過原始代碼do – Yusuf

試試這個：

<!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-21 19:33:32 Patriotec

但仍然。因爲我也有我的懸停功能，所以當我的鼠標離開該區域時，我無法保持深藍色 – Yusuf

單選按鈕改變表格行的背景顏色，當選擇另一個單選按鈕而沒有「懸停」干擾時恢復正常

回答

相關問題