javascript - 无法取消选中复选框 (HTML)

Question

我正在为表单使用 JavaScript 开发自动完成功能，但我的 HTML 文件中的复选框遇到了问题。基本思想是用户应该能够在表单字段集中填写他们的发货名称和邮政编码，然后如果他们选中“账单信息是否相同？”，将调用一个 JS 函数来填写账单用于具有相同运费的账单名称和邮政编码的字段集。该复选框能够完成此操作，但我无法取消选中它以清除帐单信息。本质上，我无法取消选中我的复选框。我的代码如下:

function billingFunction(){
  var billName=document.getElementById("billingName");
  var shipName=document.getElementById("shippingName");
  var billZip=document.getElementById("billingZip");
  var shipZip=document.getElementById("shippingZip");
  var same=document.getElementById("same");

  if (same.checked=true){
    billName.value=shipName.value;
    billZip.value=shipZip.value;
  }
  else{
    billName.value="";
    billZip.value="";
  }
}

<form>
    <fieldset>
        <legend>Shipping Information</legend>
        <label for ="shippingName">Name:</label>
        <input type = "text" name = "shipName" id = "shippingName" required><br/>
        <label for = "shippingZip">Zip code:</label>
        <input type = "text" name = "shipZip" id = "shippingZip" pattern = "[0-9]{5}" required><br/>
    </fieldset>

    <input type="checkbox" id="same" name="same" onchange= "billingFunction()"/>
    <label for = "same">Is the Billing Information the Same?</label>

    <fieldset> 
        <legend>Billing Information</legend>
        <label for ="billingName">Name:</label>
        <input type = "text" name = "billName" id = "billingName" required><br/>
        <label for = "billingZip">Zip code:</label>
        <input type = "text" name = "billZip" id = "billingZip" pattern = "[0-9]{5}" required><br/>
    </fieldset>
        <input type = "submit" value = "Verify"/>
    </form>

Answer 1

您的 if 语句比较未使用正确的相等性检查，而是将已检查的属性指定为 true。更改您的代码:

if (same.checked=true){ //This does assignment
   billName.value=shipName.value;
   billZip.value=shipZip.value;
}
else{
   billName.value="";
   billZip.value="";
}

对此:

if (same.checked === true){ //This does equality check
   billName.value=shipName.value;
   billZip.value=shipZip.value;
}
else{
   billName.value="";
   billZip.value="";
}