Question

任何人都可以指出我正确的方向，为什么我的计算按钮不会计算。它甚至不会将任何错误消息抛到屏幕上，但我的清除按钮确实有效。它可能很小，但我无法弄清楚我的生活-_-。

var $ = function(id) {
  return document.getElementById(id);
}
var virusRemovalPrice = 20.00;
var websiteMakingCost = 75.00;
var computerServicingCost = 100.00;

var calculateTotal = function() {
  var virusRemoval = parseFloat($("virusRemoval").value);
  var websiteMaking = parseFloat($("websiteMaking").value);
  var computerOptimizationAndSetUp = parseFloat($("computerOptimizationAndSetUp").value);
  var totalCost = parseFloat(($("totalCost").value));

  if (isNaN(virusRemoval) || virusRemoval < 0) {
    alert("Value must be numeric and at least zero. ");
    $("virusRemoval").focus()
  } else if (isNaN(websiteMaking) || websiteMaking < 0) {
    alert("Value must be numeric and at least zero. ");
    $("websiteMaking").focus()
  } else if (isNaN(computerOptimizationAndSetUp) || computerOptimizationAndSetUp < 0) {
    alert("Value must be numeric and at least zero. ");
    $("computerOptimizationAndSetUp").focus()
  } else {
    do {
      var ii = 0;
      var cost = ((virusRemovalPrice * virusRemoval) + (websiteMakingCost * websiteMaking) + (computerServicingCost * computerOptimizationAndSetUp));
      $("cost").value = cost.toFixed(2); //total cost final
      if (cost > 1) {
        alert("Your total is " + cost + " hope to see you soon!");
      }
    } while (ii = 0)


  }



};
var clearValues = function() {
  var virusRemoval = parseFloat($("virusRemoval").value = "");
  var websiteMaking = parseFloat($("websiteMaking").value = "");
  var computerOptimizationAndSetUp = parseFloat($("computerOptimizationAndSetUp").value = "");
  var totalCost = parseFloat($("totalCost").value = "");
}

<form class="anotheremoved">
  <h2>Total Cost</h2>
  <label for="virusRemoval">Virus Removal:</label>
  <br />
  <input type="text" id="virusRemoval">
  <br />

  <label for="websiteMaking">Website Design:</label>
  <br />
  <input type="text" id="websiteMaking">
  <br />

  <label for="computerOptimizationAndSetUp">Computer Setup:</label>
  <br />
  <input type="text" id="computerOptimizationAndSetUp">
  <br />
  <br />
  <label for="totalCost">Your Total Cost is:</label>
  <input type="text" id="TotalCost" disabled>
  <br />
  <input class="removed" type="button" id="calculateTotal" value="Calculate " onblur="calculateTotal()">
  <input class="removed" type="button" id="clear" value="Clear" onclick="clearValues()">
</form>

循环在那里的原因是因为我们需要有一个循环而我找不到一个很好的理由，所以我用了一个总是真的让它不受影响lol 。可能会给我带来一个无限循环，但我稍后会想到这一点，我只是试图在这里做点事情哈哈。我曾尝试重写其他2次并仍然到达同一地点，所以我意识到这可能是小事，我是Javascript的新手。谢谢。

Answer 1

问题是您在输入按钮中有id="calculateTotal"。元素ID会自动转换为顶级变量，因此这将替换名为calculateTotal的函数。只需为该功能提供与按钮ID不同的名称。

你也有拼写错误。总费用字段的ID为TotalCost，但代码使用$('totalCost')和$（＆＃39;费用＆＃39;）。

最好在onclick中进行计算，而不是onblur。否则，您必须单击按钮，然后单击其他内容以查看结果。

在clearValues函数中，无需分配变量并调用parseFloat。只需将每个值设置为空字符串即可。您也可以使用<input type="reset">，将表单中的所有输入自动重置为初始值。

＆＃13;

var $ = function(id) {
  return document.getElementById(id);
}
var virusRemovalPrice = 20.00;
var websiteMakingCost = 75.00;
var computerServicingCost = 100.00;

var calculateTotal = function() {
  var virusRemoval = parseFloat($("virusRemoval").value);
  var websiteMaking = parseFloat($("websiteMaking").value);
  var computerOptimizationAndSetUp = parseFloat($("computerOptimizationAndSetUp").value);
  var totalCost = parseFloat(($("TotalCost").value));

  if (isNaN(virusRemoval) || virusRemoval < 0) {
    alert("Value must be numeric and at least zero. ");
    $("virusRemoval").focus()
  } else if (isNaN(websiteMaking) || websiteMaking < 0) {
    alert("Value must be numeric and at least zero. ");
    $("websiteMaking").focus()
  } else if (isNaN(computerOptimizationAndSetUp) || computerOptimizationAndSetUp < 0) {
    alert("Value must be numeric and at least zero. ");
    $("computerOptimizationAndSetUp").focus()
  } else {
    do {
      var ii = 0;
      var cost = ((virusRemovalPrice * virusRemoval) + (websiteMakingCost * websiteMaking) + (computerServicingCost * computerOptimizationAndSetUp));
      $("TotalCost").value = cost.toFixed(2); //total cost final
      if (cost > 1) {
        alert("Your total is " + cost + " hope to see you soon!");
      }
    } while (ii = 0)
  }
};

var clearValues = function() {
  $("virusRemoval").value = "";
  $("websiteMaking").value = "";
  $("computerOptimizationAndSetUp").value = "";
  $("TotalCost").value = "";
}

＆＃13;

<form class="anotheremoved">
  <h2>Total Cost</h2>
  <label for="virusRemoval">Virus Removal:</label>
  <br />
  <input type="text" id="virusRemoval">
  <br />

  <label for="websiteMaking">Website Design:</label>
  <br />
  <input type="text" id="websiteMaking">
  <br />

  <label for="computerOptimizationAndSetUp">Computer Setup:</label>
  <br />
  <input type="text" id="computerOptimizationAndSetUp">
  <br />
  <br />
  <label for="totalCost">Your Total Cost is:</label>
  <input type="text" id="TotalCost" disabled>
  <br />
  <input class="removed" type="button" id="calculateTotalButton" value="Calculate " onclick="calculateTotal()">
  <input class="removed" type="button" id="clear" value="Clear" onclick="clearValues()">
</form>

＆＃13;

Javascript不会计算

1 个答案: