Question

只是尝试制作一个简单的重量转换器程序，但结果一直给我NaN或0.我使用基本相同的功能编码了一个类似的计算器，它工作正常，我不知道我在这里缺少什么。

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=1, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="weight.js"></script>
    <title>Weight Converter</title>
</head>
<body>

    <div>
        <input id="pounds" type="text" placeholder="Enter weight in pounds"/>
        <input type="button" value="convert" onclick="calc()"/>
    </div>




</body>
</html>

JS：

var k = document.getElementById('pounds').value;


function calc(){
    var result = (k / 2.2);
    alert(result + " kilograms");
    console.log(result);
}

Answer 1

您已尝试在 .value被触发之前获取onclick 。在页面加载时，元素的value是一个空字符串。尝试在点击之后获取值，而不是之前：

＆＃13;
＆＃13;
function calc() { var k = document.getElementById('pounds').value; var result = (k / 2.2); alert(result + " kilograms"); console.log(result); }
＆＃13;
<div> <input id="pounds" type="text" placeholder="Enter weight in pounds" /> <input type="button" value="convert" onclick="calc()" /> </div>
＆＃13;
＆＃13;
＆＃13;

Answer 2

也许尝试这样的事情。等待窗口加载然后运行calc函数（已经有DOM可用（例如任何div ID或类），因为已调用Window.load）

window.onload = function() {
  calc();
};

function calc() {
  let k = document.getElementById('pounds');
  k.addEventListener('click', function () {
    let result = document.getElementById('pounds').value / 2.2;
    alert(result.toFixed(1) + " kilograms");
    console.log(result);
  });
}

值返回0或NaN而不是实际结果

2 个答案: