0

我刚刚完成了一项任务，该任务要求我构建一个汇总订单详细信息等的小表格。它在 Chrome 中运行良好，但我在 Firefox 中进行了测试（因为评估员将使用它）但它无法工作一点也不。关于为什么的任何提示或解决方案将不胜感激。谢谢

JavaScript

function list(theform){

  var mem = theform.elements["mem"].value;
  var cov = theform.elements["cover"].value;
  var cha = theform.elements["charger"].value;
  var scr = theform.elements["screen"].value;
  var del = theform.elements["delivery"].value;
  var qty = theform.elements["qty"].value;


  acc = (parseInt(mem) + parseInt(cov) + parseInt(cha) + parseFloat(scr) + parseInt(del)) * qty;

  total.value = "$" + Math.round(acc*100)/100;
  return false;
}

HTML

<form id="accform" onsubmit="return list(this)">

        <label class="third column" for="memory">Memory</label>
        <label class="third column" for="case">Case</label>
        <label class="third column" for="memory">Charger</label>

        <select  class="third column" id="mem" name="mem">
          <option value="0">2GB : No charge</option>
          <option value="5">4GB : $5.00</option>
          <option value="12">8GB : $12.00</option>
          <option value="24">16GB : $24.00</option>
        </select>

        <select  class="third column" id="cover" name="cover">
          <option value="0">No case </option>
          <option value="4">Leather case : $4.00 </option>
          <option value="4">Silicon case : $4.00 </option>
        </select>

        <select  class="third column" id="charger" name="charger">
          <option value="0">No charger </option>
          <option value="5">Car charger : $5.00 </option>
          <option value="6">Car charger holder : $6.00 </option>
        </select> 

        <label class="third column" for="memory">Screen protector</label>
        <label class="third column" for="case">Shipping</label>
        <div class="full column"></div>

        <select  class="third column" id="screen" name="screen">
          <option value="0">None</option>
          <option value="0.99">x1 : $0.99</option>
          <option value="1.79">x2 : $1.79</option>
          <option value="2.39">x3 : $2.39</option>
          <option value="3.40">x5 : $3.40 </option>
        </select>
        <select  class="third column" id="delivery" name="delivery">
          <option value="0">Normal shipping : No charge </option>
          <option value="35">Expedited Delivery (Fedox) : $35.00</option>
        </select>
        <div class="full column">
        </div>

        <label class="third column" for="qty">Quantity</label>
        <label class="third column" for="total">Total</label>
        <div class="full column">
        </div>

        <div class="third column">
        <input  id="qty"/>
      </div>
        <input class="third column "id="total"/>

        <button class="submit">Calculate</button>
        <div class="full column">
        </div>

      </form>
4

2 回答 2

1

您的脚本在我的 Firefox 上运行良好，即使它在控制台中发出警告：

ID/NAME 在全局范围内引用的元素。请改用 W3C 标准 document.getElementById()。

那是因为total没有在您的函数中定义，请尝试：

document.getElementById('total').value = "$" + Math.round(acc*100)/100;

JSFiddle <-- 在 Nightly 15a 上测试

检查它是否有帮助以及小提琴在您的 Firefox 中是否有效。

此外，正如@dibs 所述，您可以通过在其前面acc添加来定义：var

var acc = (parseInt(mem) + parseInt(cov) + parseInt(cha) + parseFloat(scr) + parseInt(del)) * qty;

但这不太可能给您带来任何麻烦，除了可能会意外创建全局范围变量。

于 2012-05-27T01:35:06.570 回答
0

尝试在jslint.com上检查你的脚本，看看你有什么错误。

'acc' was used before it was defined.
于 2012-05-27T01:28:15.737 回答