複選框：一次只允許單擊一個複選框

Question

我目前正在使用複選框並根據所選值顯示值。幾乎所有的東西都在異常工作，我必須選中method of shipping。現在用戶可以選擇兩種方式，這是一個問題。有沒有辦法只允許一個複選框檢查method of shipping？ EXAMPLE

JS

<script> 
function check_value(currentElement, val, id, type) { 
    var el = document.getElementById("imgBox" + id); 
    if (val > 0 && val < 4) { //will trigger when [1,2,3] 

     if(currentElement.checked) 
     { 
      el.src = "images/" + type + val + ".jpg"; 
      el.style.display = ""; 
     } 
     else 
     { 
      el.src = ""; 
      el.style.display = "none"; 
     } 

    } 
}  
</script> 

HTML

<h2>Choose method of shipping</h2> 
<form name="shipping_list"> 
    <input type="checkbox" name="shipping1" onclick='check_value(this, 1, "4", "shipping")'/> USPS Ground<br /> 
    <input type="checkbox" name="shipping2" onclick='check_value(this, 2, "4", "shipping")'/> FedEx   
</form> 

<img id="imgBox4" src="#" style="display:none"> 

Answer 1

你應該使用單選按鈕來代替：

<form name="shipping_list"> 
    <input type="radio" name="shipping" id="shipping1" onclick='check_value(this, 1, "4", "shipping")'/> USPS Ground<br /> 
    <input type="radio" name="shipping" id="shipping2" onclick='check_value(this, 2, "4", "shipping")'/> FedEx   
</form> 

的關鍵是name屬性的值應該是同爲屬於一個組的所有單選按鈕。

Answer 2

怎麼樣radio buttons？

<input type="radio" name="shipping" onclick="check_value(this, 1, '4', 'shipping');"> 

Answer 3

$(function() { 
    $('input[type="checkbox"]').bind('click',function() { 
    $('input[type="checkbox"]').not(this).prop("checked", false); 
    }); 
});