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值。

您应该将检索值val的行移动到convert()函数内部，以便在单击时更新。目前，您只是在启动时读取该值（它很可能是空的）并且永远不会更新它。

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");});

NEDD

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

Answer 3

叶先生的第一个评论者回答你的问题。您需要在点击时更新val变量。您可以在函数调用中声明它，然后在函数调用中更新它，或者只是在单击侦听器中将其创建为范围变量。

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

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

3 个答案: