取消選中復選框時，從收音機中刪除“選中”

Question

我有一個復選框（ #FBmngCH ）， #FBmngCH該復選框可顯示一組單選按鈕（ name=adManage ）。 取消選中該復選框后，先前選中的單選按鈕仍保持選中狀態。 取消選中復選框后，我希望刪除單選按鈕的選中狀態。

這是以一種形式使用的，因此，如果用戶改變了選擇該服務的主意，我也希望擦除有關該服務的詳細信息（因此所選無線電的值將不會最終出現在PHP中，電子郵件）。 我希望這是有道理的。

我花了一些時間，似乎無法正常工作。 最后一組if語句是我編寫的代碼的一部分。 不知道我是否缺少某些東西，選擇了錯誤的東西或什么。 任何幫助，將不勝感激。 謝謝！

HTML

<li>
    <input type="checkbox" class="cbox" name="FBchecks[]" value="Facebook Ad MGMT" id="FBmngCH">
    <label for="test">Facebook Ad Management</label>
    <ul id="FBmngList">
        <li>
            <input type="radio" name="adManage" value="Ad Management 1" id="adMan1">
            <label for="adMan1">Ad Fund - 1</label>
        </li>
        <li>
            <input type="radio" name="adManage" value="Ad Management 2" id="adMan2">
            <label for="adMan2">Ad Fund - 2</label>
        </li>
        <li>
            <input type="radio" name="adManage" value="Ad Management 3" id="adMan3">
            <label for="adMan3">Ad Fund - 3</label>
        </li>
        <li>
            <input type="radio" name="adManage" value="Ad Management 4" id="adMan4">
            <label for="adMan4">Ad Fund - 4</label>
        </li>
        <div id="FBADerror" class="acctError"></div>
    </ul>
</li>

JS

$FBmngCH = $("#FBmngCH");
$FBmngList = $("#FBmngList");

//hide FB Management List
$FBmngList.hide();

//on FB Management select
$FBmngCH.click(function() {
    //toggle FB Management List
    $FBmngList.toggle();
});

$FBadValid = false;
$FBADerror = $("#FBADerror");

//if FB Ad Management is checked
if ($FBmngCH.attr('checked')) function validateFB() {
   $("input[name=adManage]").each(function () {   //LoopingthroughradioButtons
    // "this" is the current element(radio) in the loop
      if ($(this).is(':checked')) {
            $FBadValid = true; //Radio Button is Checked);
      }

      if ($FBadValid.attr = true ) {
            $FBADerror.empty();
      }
   });
};
if ($FBmngCH.blur($FBadValid.attr = false)) {
    $FBADerror.append("<li> Please select a Facebook Ad plan. </li>");
    //appends error to document
}   
if ($FBmngCH.blur($FBmngCH.not('checked'))) {
    $("input[name=adManage]").each(function () {
        if ($(this).is(':checked')) {
            $("input[name=adManage]").removeAttr('checked');
        }
    });
    //remove checks from radios
};  
$("input[name=adManage]").click(validateFB);

Answer 1

也許我不了解您的要求，但是您不能只在復選框事件例程中對此進行測試並取消選中選中的單選按鈕：

$FBmngCH.click(function () {
    //toggle FB Management List
    $FBmngList.toggle();
    if (!$FBmngList.attr('checked')) {
        $FBmngList.find('input:checked').attr('checked', false);
    }
});

看到這個小提琴。

Answer 2

您的代碼中幾乎沒有錯誤：

if ($FBmngCH.blur($FBadValid.attr = false)) {

這是不正確的語法。 它應該是：

$FBmngCH.blur(function(){
    if ($FBadValid === false) {

    }
});

基本上，由於您要切換整個無線電部分，並願意在不檢查任何條件的情況下刪除其:checked屬性，因此不需要循環或if($(this).is(':checked'))語句。 只需從所有收音機中刪除:checked屬性即可。 您還可以顯示每個復選框點擊錯誤信息，不if條件，因為整個部分反正隱藏。

您應該以非常短的代碼結尾，如下所示：

$FBmngCH = $("#FBmngCH");
$FBmngList = $("#FBmngList").hide();
$FBADerror = $("#FBADerror");

$FBmngCH.click(function() {
    // no need for loops and if's there. Radios and the message are hidden.
    $FBmngList.toggle();
    $FBADerror.html("<li> Please select a Facebook Ad plan. </li>"); 
    $("input[name=adManage]").prop('checked', false);
});

$("input[name=adManage]").click(function(){
    // no need for loops there. Radios and the message are hidden.
    // Also, no need for if($(this).is(':checked')){. Since it's a click handler, something has to be :checked on radio click.
    $FBADerror.empty();
});

DEMO