當所有複選框爲假時檢查單選按鈕

Question

當所有元素'複選框'未選中時，我需要設置一個單選按鈕（'no_subscribe'）爲true。取消選中所有這些複選框後會發生這種情況。 請原諒我，如果這已被問到別處。我是新來的JavaScript和編程一般，所以任何幫助，非常感謝！我已經能夠使'訂閱'按鈕做我想要的，但我無法弄清楚相反的情況。這些都在一個名爲「郵件程序」的表單內。我最近刪除了我所做的嘗試。他們沒有工作，所以我很抱歉沒有代碼來排除故障。

<fieldset> 
Subscribe to our Mailing List? 
     <input type = "radio" name = "yes" id = "subscribe" onclick = "subscribe_to_all();" value = "yes" />Yes 
     <input type = "radio" name = "no" id = "no_subscribe" onclick = "subscribe_to_none();" value = "no" />No 
</fieldset> 

<fieldset name = "subscribe"> 
<legend>Mailing List Subscriptions</legend> 
    <input type="checkbox" id = "c1" name="subscriptions" onclick = "radio_yes();" value="CorporateEmails"/> 
    Corporate Press Release Emails<br /> 
    <input type="checkbox" id = "c2" name="subscriptions" onclick = "radio_yes();" value="SoftwareAdvertising"/> 
    Upgrade Software Advertising List<br /> 
    <input type="checkbox" id = "c3" name="subscriptions" onclick = "radio_yes();" value="PostBuyoutSpammers"/> 
    List given to spammers after buyout<br /> 
    <input type="checkbox" id = "c4" name="subscriptions" onclick = "radio_yes();" value="NonCynical"/> 
    The only non-cynical list<br /> 
    <input type="checkbox" id = "c5" name="subscriptions" onclick = "radio_yes();" value="SelltoSpammers"/> 
    List to sell to spammers<br /> 
    <input type="checkbox" id = "c6" name="subscriptions" onclick = "radio_yes();" value="SpamList"/> 
    Spam List<br /> 

外部JavaScript文件：

function subscribe_to_all() { 
    for (i = 0; i < document.mailer.subscriptions.length; i++) { 
     document.mailer.subscriptions[i].checked = true; 
    } 
} 

function subscribe_to_none() { 
    for (i = 0; i < document.mailer.subscriptions.length; i++) { 
     document.mailer.subscriptions[i].checked = false; 
    } 
} 

function radio_yes() { 
    document.getElementById("subscribe").checked = true; 
}​ 

Answer 1

我已經使用了新的功能。它沒有被優化。我已經使用了一個新功能。您可以在循環中獲取複選框狀態。但我的代碼工作。

認沽class="subscriptions"屬性的所有複選框：只需複製，粘貼和查看更改

<script type="text/javascript"> 
function subscribe_to_all() { 

for (i=0;i<document.mailer.subscriptions.length;i++){ 

document.mailer.subscriptions[i].checked = true; 

} 
} 

function subscribe_to_none() { 

for (i=0;i<document.mailer.subscriptions.length;i++){ 

document.mailer.subscriptions[i].checked = false; 

} 
} 
function radio_yes() { 

document.getElementById("subscribe").checked = true; 

} 
function radio_uncheck() 
{ 


     c1=document.getElementById("c1").checked; 
     c2=document.getElementById("c2").checked; 
     c3=document.getElementById("c3").checked; 
     c4=document.getElementById("c4").checked; 
     c5=document.getElementById("c5").checked; 
     c6=document.getElementById("c6").checked; 
     console.log(c1); 
     if(c1==false && c2==false && c3==false && c4==false && c5==false && c6==false) 
     {document.getElementById("subscribe").checked=false;} 

    //document.getElementById("subscribe").checked=false; 
} 
</script> 

<fieldset> 
Subscribe to our Mailing List? 
     <input type = "radio" name = "yes" id = "subscribe" onclick = "subscribe_to_all();" value = "yes" />Yes 
     <input type = "radio" name = "no" id = "no_subscribe" onclick = "subscribe_to_none();" value = "no" />No 
</fieldset> 

<fieldset name = "subscribe"> 
<legend>Mailing List Subscriptions</legend> 
    <input type="checkbox" id = "c1" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="CorporateEmails"/> 
    Corporate Press Release Emails<br /> 
    <input type="checkbox" id = "c2" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="SoftwareAdvertising"/> 
    Upgrade Software Advertising List<br /> 
    <input type="checkbox" id = "c3" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="PostBuyoutSpammers"/> 
    List given to spammers after buyout<br /> 
    <input type="checkbox" id = "c4" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="NonCynical"/> 
    The only non-cynical list<br /> 
    <input type="checkbox" id = "c5" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="SelltoSpammers"/> 
    List to sell to spammers<br /> 
    <input type="checkbox" id = "c6" name="subscriptions" onclick = "radio_yes();radio_uncheck();" value="SpamList"/> 
    Spam List<br /> 

Answer 2

通過使用jQuery您可以通過如下解決這個問題。

$('.subscriptions').change(function() { 
    var allUncheck = true; 
    $('.subscriptions').each(function() { 
     if ($(this).is(':checked')) allUncheck = false; 
    }); 
    if (allUncheck == true) { 
     $('#no_subscribe').attr('checked', 'true'); 
    } else { 
     $('#no_subscribe').attr('checked', false); 
    } 
});​ 

Answer 3

這可以用jquery解決。第一個字段集中的單選按鈕應該具有相同的名稱值......我已經在您的代碼中嘗試了這一點。只是檢查出來。我爲字段添加了一個id'搜索'...

$(function() { 
$('#search input:checkbox').click(function() { 
    var classes = $('#search input:checkbox:checked'); 
    if(classes.length == 0) 
    { 
     $('input:radio[name=no]:nth(1)').attr('checked',true); 
    } 
    else 
    { 
     $('input:radio[name=no]:nth(1)').attr('checked',false); 
    }    
}); 
}); 

這是工作小提琴。 http://jsfiddle.net/NBCX8/4/