gpt4 book ai didi

javascript - 我无法理解为什么我总是将 NaN 作为返回输出

转载 作者:行者123 更新时间:2023-12-04 14:06:07 25 4
gpt4 key购买 nike

const myFunction = function() {
let fah;
fah = document.getElementById('fah').value;

let celcius;
celcius = ((fah - 32) * 5/9);

document.getElementById('cel').value = celcius;
};
<body>
<main>
<h1 class="header">Fahrenhiet to celcius</h1>
<div class="wrapper">
<form class="form">
<div class="fah">
<label for="fah" class="fahrenhiet" id="fah">&#176F</label>
<input type="text" id="fah" class="input-fah" value="">
</div>
<div class="span">
<span class="equals"> &#61 </span>
</div>
<div class="cel">
<input type="text" id="cel" class="input-cel" value="">
<label for="cel" class="celcius">&#176C</label>
</div>
<div class="bttn-group">
<button class="bttn bttn-sumbit" type="" onclick="myFunction(); event.preventDefault();">Submit</button>
<input class="bttn bttn-reset" type="reset" value="Reset">
</div>
</form>
</div>
</main>
<script src="script.js"></script>
</body>

我在一周后回到这段代码,它之前运行得很好。现在突然之间,每次我运行它时,我都会不断得到 NaN 作为我的输出。我已经尝试了所有我能想到的甚至使用 parseInt() 的方法,但是在玩弄之后我意识到据我所知我的 fah 变量没有被视为一个数字。我尝试删除 document.getElementById('fah').value;并使用了一个随机数,它似乎有效。我不知所措。我仍在学习 javascript,所以我确定这是我还没有学过的东西。

最佳答案

您的 HTML 中有重复 ID,该 ID 无效并导致您的代码选取标签的 value 而不是输入字段。

您还应该parseInt 用户输入以确保它是一个数字。

const myFunction = function() {
let fah;
fah = parseInt(document.getElementById('fah').value);
// CHANGE ---^

let celcius;
celcius = ((fah - 32) * 5/9);

document.getElementById('cel').value = celcius;
};
<body>
<main>
<h1 class="header">Fahrenhiet to celcius</h1>
<div class="wrapper">
<form class="form">
<div class="fah">
<label for="fah" class="fahrenhiet" id="fah-label">&#176F</label>
<!-- CHANGE ---------------------------------------^ -->
<input type="text" id="fah" class="input-fah" value="">
</div>
<div class="span">
<span class="equals"> &#61 </span>
</div>
<div class="cel">
<input type="text" id="cel" class="input-cel" value="">
<label for="cel" class="celcius">&#176C</label>
</div>
<div class="bttn-group">
<button class="bttn bttn-sumbit" type="" onclick="myFunction(); event.preventDefault();">Submit</button>
<input class="bttn bttn-reset" type="reset" value="Reset">
</div>
</form>
</div>
</main>
<script src="script.js"></script>
</body>

关于javascript - 我无法理解为什么我总是将 NaN 作为返回输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68447428/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com