JS | 尝试从文本输入中提取内容时将NaN接收为输出

Question

我是JS的新手，无法将文本输入解析为计算功能。 我必须做一些根本上错误的事情，因为我知道实际的解析方法是正确的。 我一直在尝试很多不同的事情，但此时我有点圈了。 我只是在做一个简单的celius / farenheit转换器。 任何帮助是极大的赞赏！

注意我正在尝试仅使用纯JS

<body>
    <h2>Temperature Converter</h2>
    <form>
        <input id="degrees" type="text" size="5">
        <input type="radio" value="celsius" name="one" id="celsius">Celsius
        <input type="radio" value="farenheit" name="one" id="farenheit">Farenheit
        <button id="equals" type="button">=</button>
        <output id="output">
    </form>
    <script type="text/javascript" src="js/script2.js"></script>
</body>

var val = parseFloat(document.querySelector("#degrees").value);
var output = document.getElementById("output");


window.addEventListener("load", main);

function main() {
    // listen for a click on the "equals" button
    document.querySelector("#equals").addEventListener(
        "click", function(){convert("val");}); 
}

function convert(val) {
    var c = document.getElementById("celsius");
    var f = document.getElementById("farenheit");

    if (c.checked) {
        toFarenheit(val);
        console.log("celsius selected");

    } else if (f.checked) {
        toCelsius(val);
        console.log("farenheit selected");

    } else {
        console.log("Select whether input is in celsius or farenheit.");
    }
}


function toCelsius(val) {

    output.value = (val - 32) / 1.8;
    console.log(output.value);
}

function toFarenheit(val) {

    output.value = val * 1.8 + 32;
    console.log(output.value);
}

Answer 1

这一点

convert("val");

您为您的convert()函数提供了要用于转换的字符串"val" ，而不是变量。 这将在以后的计算中得出NaN值。

您应该将这行移动到在convert()函数内部检索值val ，以便在单击时将其更新。 当前，您仅在启动时读取该值（该值很可能为空），并且从不更新它。

function convert() {
    var c = document.getElementById("celsius");
    var f = document.getElementById("farenheit");
    var val = parseFloat(document.querySelector("#degrees").value);

    if (c.checked) {
        toFarenheit(val);
        console.log("celsius selected");

    } else if (f.checked) {
        toCelsius(val);
        console.log("farenheit selected");

    } else {
        console.log("Select whether input is in celsius or farenheit.");
    }
}

Answer 2

这是错误

     document.querySelector("#equals").addEventListener(
    "click", function(){convert("val");});

内德

     document.querySelector("#equals").addEventListener(
    "click", function(){convert(val);});

Answer 3

是的，您的回答的第一个评论者是鼻子。 您需要在点击时更新val变量。 您可以先声明它，然后在函数调用中对其进行更新，或者仅在单击侦听器中将其创建为作用域变量。

工作提琴： https : //jsfiddle.net/6s5nx7dn/

JS | 尝试从文本输入中提取内容时将NaN接收为输出

问题描述

3 个解决方案

解决方案1
0 2016-02-19 08:19:23

解决方案2
0 2016-02-19 08:25:48

解决方案3
0 2016-02-19 09:05:18

JS | 尝试从文本输入中提取内容时将NaN接收为输出

问题描述

3 个解决方案

解决方案1 0 2016-02-19 08:19:23

解决方案2 0 2016-02-19 08:25:48

解决方案3 0 2016-02-19 09:05:18

解决方案1
0 2016-02-19 08:19:23

解决方案2
0 2016-02-19 08:25:48

解决方案3
0 2016-02-19 09:05:18