jQuery UI單選按鈕 - 每種選擇都有不同的顏色？

Question

我使用jQuery UI單選按鈕Aristo主題，他們太棒了。

問題是，我有兩個單選按鈕，有兩個選項，'批准'和'拒絕' - 如果批准被選中，我希望按鈕是藍色，這是如何是偉大的時刻。但是，如果我選擇「拒絕」，我想按鈕變爲紅色（批​​準變灰，因爲它）

這裏是我的HTML：

<div id="toggle"> 
    <input type="radio" id="approve" name="approved" checked /><label for="approve">Approve</label> 
    <input type="radio" id="reject" name="approved" /><label for="reject">Reject</label> 
</div> 

我的CSS：

#reject .ui-button.ui-state-focus { 
    background: url(images/bg_red.png) repeat-x; 
    font-size: 200%; 
} 

該CSS根本沒有針對標籤，我想是因爲它是由jQuery UI創建的疊加層，所以很長一段時間，但有沒有方法根據選擇更改顏色？

謝謝！

Answer 1

你可以做到這一點

$('#approve').change(function(){ 
    if($(this).is(':checked')) 
    { 
     $(this).addClass('blue'); 
     $('#reject').removeClass('red'); 
    } 
}); 

$('#reject').change(function(){ 
    if($(this).is(':checked')) 
    { 
     $(this).addClass('red'); 
     $('#approve').removeClass('blue'); 
    } 
});