复选框:一次只允许一个复选框

Question

我目前正在使用复选框并根据所选值显示值.几乎所有东西都在工作,除了我必须复选框method of shipping.现在,用户可以选择两种方式,这是一个问题.有没有办法只允许检查一个复选框method of shipping？例

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属性,属于一个组的所有单选按钮的值应该相同.