Question

我是JavaScript的初学者，正在尝试完成一个简单的账单拆分练习。在HTML表单中，您可以输入一顿饭的价格，要支付多少人以及您想留下多少小费，然后应该给出每个人应该支付的价格。当我输入“价格：100，提示：0，人数：2”的值时，我希望它的值为50，但它的值为500。我相信这是因为它会将输入识别为字符串而不是字符串到整数。

我曾尝试使用Number（）和parseInt（）转换字符串，但是这些似乎都不起作用，而是给出了错误的值，这些错误导致无法识别值。

  const price = document.querySelector("#price");
  const numPeople = document.querySelector("#number-people");
  const tip = document.querySelector("#tip");
  const errorMsg = document.querySelector("#error-msg");
  const resultDisplay = document.querySelector("#result");

  form.addEventListener("submit", onSubmit);

function onSubmit(e) {
  e.preventDefault();
  console.log("BUTTON CLICKED"); // CONFIRM BUTTON PRESSED
  if(price.value === "" || numPeople.value === "" || tip.value === "") { // SIMPLE VALIDATION
      errorMsg.innerHTML = "ENTER ALL FIELDS"; // ENTER HTML INTO error-msg DIV 
      conole.log("NOT ALL FIELS WERE ENTERED"); // SEND ERROR TO LOG
  } else {
      console.log("SUCCESS"); // SEND CONFIRMATION TO LOG
      console.log(`Price is ${price.value}, number of people is ${numPeople.value} and tip is ${tip.value}`); // SEND VALUES ENTERED TO LOG
      const result = (price.value + tip.value) / numPeople.value; // COMPLETE CALCULATION
      console.log(result); // SEND THE RESULT TO THE LOG
  }
}

我希望（100 + 0）/ 2的输出为50，但它是500。

使用parseInt（）和Number（）时，我做到了：

const result = (parseInt(price.value) + parseInt(tip.value)) / parseInt(numPeople.value);

和Number（）分别。

很抱歉，如果这是一个简单的问题，将不胜感激。

Answer 1

您所走的路是正确的，但您应该使用Float而不是Int，因为价格可能会包含小数部分，而parseInt会忽略

var result = (parseFloat(price.value) + parseFloat(tip.value)) / parseInt(numPeople.value)

请注意，它将为您提供一个全精度的浮点数，然后您可以将数字格式化为带有所需小数位数的字符串。

将以表格形式输入的值从字符串更改为整数javascript

1 个答案: