Question

我正在尝试学习javascript，所以我正在制作一个计算厨柜价格的计算器。我有3个品牌可供选择，每个品牌有不同类型的橱柜（底座，墙壁，台面）。所有这些价格都不同，所以当我点击“计算”时，功能会通过单选按钮查看选择的品牌，通过下拉框选择什么类型的橱柜并计算价格。我在嵌套if中有这些，但每当我点击计算它似乎没有运行外部的if块，如果基于是否选择了品牌名称。到目前为止，当我点击计算没有任何事情发生，除了表单重置自己。这是我的

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

单=说明了这一点。您想比较双方是否相同，因此您希望==进行弱比较（转换类型为您）或===进行强比较（完全相同）

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

1 个答案: