如果選中複選框，只選擇一個複選框（並取消選擇其餘選項）並顯示輸入字段

我有一個窗體，其中兩個複選框是「是」和「否」。這些首先是未經選擇的。我希望用戶只選擇其中的一個，如果他們不想做出決定（這就是爲什麼我沒有使用單選按鈕），可以選擇取消選擇他們的選擇。選擇是應取消選擇否，反之亦然。我不知道如何做到這一點。我使用PHP（codeigniter），Javascript和JQuery。其次，在選擇是或否之後，需要顯示輸入字段。我已經有了這個設置，但是它在「onclick」動作上切換，這意味着選擇Yes兩次顯示並隱藏輸入字段！如果選擇了「是」或「否」，我希望顯示輸入字段，如果「是」和「否」均未選中，我想要顯示輸入字段並消失。如果選中複選框，只選擇一個複選框（並取消選擇其餘選項）並顯示輸入字段
```
$do_toggle = "onClick=\"javascript:toggle('togglenote');\""; 

echo form_radio('decision'.$key,'y',FALSE,$do_toggle)."Yes "; 

echo form_radio('decision'.$key,'n',FALSE,$do_toggle)."No"; 

echo form_input($mytext); 

// I put a div tag around the form_input above 
// but it's not showing in the StackOverflow question... 
// but it's there for the toggle to work. 
```

2011-05-07 zee

作爲另一種選擇，您可以將它們全部添加爲'收音機'按鈕...並添加第三個'none' ..所以當用戶不想做出決定時，他可以點擊'無單選按鈕「 – 2011-05-07 12:27:53

表單內置許多行，每個行都帶有」是「或」否「選項。如果只有一行，那麼添加一個None就可以，但是默認情況下選擇了一個沒有選擇None的多個決策行會導致糟糕的用戶界面。除非你建議默認選擇和隱藏一個無？ – zee 2011-05-07 12:41:52

http://stackoverflow.com/questions/1467228/click-toggle-with-jquery – mplungjan 2011-05-07 16:25:44

假設你的HTML是這樣的（我認爲這是）：

<input type="checkbox" name="decisionY" value="y" /> Yes 
<input type="checkbox" name="decisionN" value="N" /> Yes 
<input type="text" id="togglenote" name="togglenote" />

你的JS是：

$(document).ready(function(){ 
    $(":checkbox[name^='decision']").change(function(){ 
    if($(this).is(":checked")){ 
     $(":checkbox[name[^='decision']").attr("checked", false); //Uncheck the other 
     $(this).attr("checked", true); 
     $("#togglenote").show(); 
    } 
    if($(":checkbox[name^='decision']:checked").size() == 0){ 
     $("#togglenote").hide(); 
    } 
    }); 
});

希望這有助於。乾杯。

來源

2011-05-07 12:47:51

唯一的問題是複選框對於Yes值和No值都具有相同的名稱。即在兩種情況下名稱=「決定」，以便我可以在提交時讀取決策值。如果兩個元素名稱都相同，如果選擇是，我不知道如何取消選中否。我想知道是否給他們分配一個不同的ID是這裏的方式。 – zee 2011-05-07 13:40:39

這應該做你想要什麼：

$("#checkbox1").change(function() { 

if ($(this).attr("checked") && $("#checkbox2").attr("checked")) { 
    $("checkbox2").removeAttr("checked"); 
} else if ($(this).attr("checked")) { 
    $("#inputfield").show(); 
} else { 
    $("#inputfield").hide(); 
} 
}); 


$("#checkbox2").change(function() { 

if ($(this).attr("checked") && $("#checkbox1").attr("checked")) { 
    $("checkbox1").removeAttr("checked"); 
} else if ($(this).attr("checked")) { 
    $("#inputfield").show(); 
} else { 
    $("#inputfield").hide(); 
} 
});

來源

2011-05-07 12:51:51 grc

選擇其中一個作爲jQuery的或JavaScript
不認爲這是100％garantee，一些黑客不能設置都和後:)
分析$ _REQUEST數組設置是/否值
做出決定。

PS。 JQuery的作品不在我的諾基亞6303c :)設備，硬編碼 - 將工作...所以應用程序必須有2個部分。

來源

2011-05-07 12:54:32

如果選中複選框，只選擇一個複選框（並取消選擇其餘選項）並顯示輸入字段

回答

相關問題