javascript - JS 函数与我的 if 语句逻辑不匹配

Question

我现在正在尝试学习 javascript，所以我正在制作一个计算器来计算厨柜的价格。我有 3 个品牌可供选择，每个品牌都有不同类型的橱柜(底座、壁挂、台面)。所有这些的价格都不同，因此当我单击“计算”时，该功能会查看通过单选按钮选择的品牌以及通过下拉框选择的橱柜类型并计算价格。我将这些放在嵌套的 if 中，但是每当我单击计算时，它似乎都不会运行外部 if block ，该 if block 基于是否选择了品牌名称。到目前为止，当我单击“计算”时，除了表单自行重置之外，没有任何反应。这是我的

function Calculate() {
  var y=document.forms["calculator"]["linFootage"].value;
  if (y=="") {
    alert("Please fll out all required forms");
    return false;
  }
  var footage=document.getElementById('sqFootage').value;
  var crnUnits=document.getElementById('crnUnits').value;
  if (document.getElementById("empire").checked=true) {
    document.getElementById("Select1").onchange=function () {
      if (this.options[this.selectedIndex].value==1) {
        var baseprice=footage * 69.99;
        var cornerPrice=crnUnits * 50.99;
        var totalPrice=baseprice+cornerPrice;
        alert("I am an alert box!");
        document.getElementById('txtResults').value=totalPrice;
        return false;
      }
      else if(this.options[this.selectedIndex].value==2) {
        var baseprice=footage * 99.99;
        var cornerPrice=crnUnits * 50.99;
        var totalPrice=baseprice+cornerPrice;
        alert("I am an alert box!");
        document.getElementById('txtResults').value=totalPrice;
        return false;
      }
      else if (this.options[this.selectedIndex].value==3) {
        alert("I am an alert box!");
        var totalPrice=footage * 30.99;
        return false;
      }
    }
  }
  else if (document.getElementById('elite').checked=true) {
    document.getElementById("Select1").onchange=function () {
      if (this.options[this.selectedIndex].value==1) {
        var baseprice=footage * 79.00;
        var cornerPrice=crnUnits * 79.99;
        var totalPrice=baseprice+cornerPrice;
        return false;
      }
      else if(this.options[this.selectedIndex].value==2) {
        var baseprice=footage * 179.00;
        var cornerPrice=crnUnits * 50.99;
        var totalPrice=baseprice+cornerPrice;
        return false;
      }
      else if(this.options[this.selectedIndex].value==3) {
        var totalPrice=footage * 189.99;
        return false;
      }
    }
  }
  else if (document.getElementById('goldstar').checked) {
    if (this.options[this.selectedIndex].value==1) {
      var baseprice=footage * 99.99;
      var cornerPrice=crnUnits * 89.99;
      var totalPrice=baseprice+cornerPrice;
      return false;
    }
    else if(this.options[this.selectedIndex].value==2) {
      var baseprice=footage * 209.99;
      var cornerPrice=crnUnits * 89.99;
      var totalPrice=baseprice+cornerPrice;
      return false;
    }
    else if(this.options[this.selectedIndex].value==3) {
      var totalPrice=footage * 212.99;
      return false;
    }
    else {
      alert("Didnt find an if");
    }
  }
  return false;
}

<form name="calculator">
  <h1>Kitchen Calculator</h1> <br />
  <table style="width:60%">
    <tr>
      <th></th>
    </tr>
    <tr>
      <td>1. Select your product type: </td>
      <td><select id="Select1" name="D1" required>
            <option value="">--Select Your Product--</option>
            <option value="1">Base Cabinets</option>
            <option value="2">Wall Cabinets</option>
            <option value="3">Counter Tops</option>
            </select></td>

    </tr>
    <tr>
      <td>2. Select your product line: </td>
      <td><input type="radio" name="brand" id="empire" onclick="changeImage('empirewall.jpg')" value="empStandard">Empire Standard<br>
        <input type="radio" name="brand" id="elite" onclick="changeImage('elitewall.jpg')" value="kitchenElite">Kitchen Elite<br>
        <input type="radio" name="brand" id="goldstar" onclick="changeImage('goldstarbase.png')" value="goldStar">Gold Star Plus<br>
      </td>
      <td>
        <img src="placeholder.png" id="imgStyles" style="width:150px;height:150px;">
      </td>
    </tr>
    <tr>
      <td>3. Enter Linear Footage: </td>
      <td>
        <div class="form-group">
          <input type="text" class="form-control" id="sqFootage" name="linFootage" placeholder="Enter Square Footage"></td>
    </tr>

    <tr>
      <td>
        <div id="crnUnitstext">4. If cabinets, how many corner units?</div>
      </td>
      <td><input type="text" id="crnUnits" name="crnUnits" placeholder="Enter corner units"></td>
    </tr>
    <tr>
      <td><button onclick="Calculate()">Calculate</button></td>
    </tr>
    <tr>
      <td>
        5. Results:
      </td>
      <td>
        <input type="text" name="output" id="txtResults">
      </td>
    </tr>
  </table>
</form>

请注意，我有几个警报只是为了进行故障排除

Answer 1

单个=表示做这个。您想要比较两侧是否相同，因此您需要 == 进行弱比较(为您转换类型)或 === 进行强比较(确切地说)相同)