为什么我的小费计算器的代码返回nan？[副本]
下面是我的代码。我假设问题来自我的函数，可能涉及到一个字符串，其中应该有一个数字值，或者类似的性质。这是一个很新的东西，所以我不能很准确地确定是什么导致了NaN响应后，点击计算。谢谢你的帮助。
console.log("Connected")
function calculateTip() {
var billAmt = document.getElementById("price")
var service = document.getElementById("service")
var tip = document.getElementById("tip")
var numOfPpl = document.getElementById("numOfPpl")
// validate input
if (billAmt === "" || service === 0) {
alert("please enter values");
return;
}
//check to see if this input is empty or less than or equal to 1
if (numOfPpl === "" || numOfPpl <= 1) {
numOfPpl = 1;
document.getElementById("each").style.display = "none";
} else {
document.getElementById("each").style.display = "block";
}
// calculate tip
var total = (billAmt * service) / numOfPpl;
total = Math.round(total * 100) / 100;
//next line allows us to always have two digits after a decimal point
total = total.toFixed(2);
//Display the tipdocument.getElementById("")
document.getElementById("totalTip").style.display = "block"
tip.innerHTML = total;
}
//hide tip amoiunt on load
document.getElementById("totalTip").style.display = "none"
document.getElementById("each").style.display = "none"
// click to call funciton
document.getElementById("calculate").onclick = function() {
calculateTip();
};<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>tip calculator</title>
</head>
<body>
<div class="container">
<h1>Tip calculator</h1>
<form>
<p id="quesiton">How much was your bill?</p>
$ <input type="text" id="price" placeholder="Bill Amount">
<p id="question">How was your service?</p>
<select id="service">
<option disabled selected value="0">Choose an Option</option>
<option value="0.3">30% - Outstanding</option>
<option value="0.2">20% - Good </option>
<option value="0.15">15% - OK</option>
<option value=".05">5% - Poor</option>
</select>
</form>
<p>How many people are sharing the bill</p>
<input id="numOfPpl" type="text" placeholder="Number of People" /> people
<button type="button" id="calculate">Calculate!</button>
</div>
<div id="totalTip">
<sup>$</sup><span id="tip">0.00</span>
<small id="each">each</small>
</div>
</body>
</html>共有1个答案
问题是您没有正确地声明变量。必须将.value添加到document.getElementById（“id”）中，才能接收输入值或选择
-
我正在做一项任务来编译Pascal的子集，在初始程序中有一行代码如下： 这让我非常困惑，因为返回一个布尔值或，因此{Bool，Int}中的 中的
-
我正在尝试HTML/CSS并尝试学习它们。但是我有一个关于计算盒子大小的小问题。 我试图理解他们使用px作为一个单位，所有的东西加起来，但当我切换到vh，大众，%一些不寻常的happerens，我不知道为什么。 所以，如果你能解释一下是怎么回事，我会很高兴的。 谢谢. 如您所见，有一些溢出的
-
它显示了以下错误：在Homepractice类中，Main方法必须返回void类型的值。gym，请将main方法定义为：public static void main（String[]args）
-
我很熟悉在JavaScript中是“怪异的”，即总是返回，如本文所述。因此，不应进行比较来检查，而应使用isNaN（..）取而代之的是。 所以我惊讶地发现 这似乎不一致。为什么会有这种行为？ 它是怎么工作的？方法是否专门检查？
-
问题内容： 只是出于好奇。 数字似乎不太合逻辑。顺便说一句，就像或返回假。这是javascript的特性之一，还是有原因呢？ 编辑：谢谢你的回答。但是，要让所有人适应现实并非易事。阅读答案和Wiki我了解得更多，但仍然有类似 与NaN的比较始终会返回无序结果，即使与自身进行比较也是如此。比较谓词是信令或非信令，信令版本表示此类比较的无效异常。相等和不相等谓词是无信号的，因此x = x返回false
-
如果参数的类型是int或float，函数应该返回>函数输入的绝对值。 否则，函数应返回“nope” 我已经完成了第一个任务，但我认为我已经完成了任务