Javascript Number.parseInt（）不断返回NaN_Javascript_Html

Javascript Number.parseInt（）不断返回NaN

javascript html

Javascript Number.parseInt（）不断返回NaN,javascript,html,Javascript,Html,我正在用JavaScript开发一个二进制到十进制和十进制到二进制的转换器，我想我应该尝试使用Number.parseInt来实现这一点。也就是说，我的输出一直显示NaN，而不是所需的转换。任何与此相关的帮助都将不胜感激 //从用户处获取二进制数以进行十进制转换让binary=document.getElementByIdbinary.value； //将基数设置为2进行十进制转换设binBase=2； //从用户处获取十进制数以进行二进制转换设decimal=document.getE

我正在用JavaScript开发一个二进制到十进制和十进制到二进制的转换器，我想我应该尝试使用Number.parseInt来实现这一点。也就是说，我的输出一直显示NaN，而不是所需的转换。任何与此相关的帮助都将不胜感激

//从用户处获取二进制数以进行十进制转换让binary=document.getElementByIdbinary.value； //将基数设置为2进行十进制转换设binBase=2； //从用户处获取十进制数以进行二进制转换设decimal=document.getElementByIddecimal.value； //将二进制转换的基数设置为10 设decBase=10； //函数将二进制转换为十进制函数getDecimalbinary，binBase{ 设finalDec=Number.parseIntbinary，binBase； //输出十进制数 document.getElementByIdshowDecimal.innerHTML=finalDec；返回最终版本； } //函数将十进制转换为二进制函数getBinarydecimal，decBase{ 设finalBin=Number.parseIntdecimal，decBase； //输出二进制数 document.getElementByIdshowBinary.innerHTML=finalBin；返回finalBin； } 二进制到十进制和后向转换器请输入要转换为十进制形式以10为基数的二进制数（以2为基数）二元的：计算十进制数为：

请输入以10为基数的十进制数，将其转换为以2为基数的二进制形式十进制的：计算二进制数为：

单击按钮时获取输入字段值：

// Function to convert binary to decimal
function getDecimal() {
   var binary = document.getElementById("binary").value;
   let finalDec = Number.parseInt(binary, 2);
   // Output the decimal number
   document.getElementById("showDecimal").innerHTML = finalDec;
   return finalDec;
}

// Function to convert decimal to binary
function getBinary() {
   var decimal = document.getElementById("decimal").value;
   let finalBin = Number.parseInt(decimal, 10).toString(2);
   // Output the binary number
   document.getElementById("showBinary").innerHTML = finalBin;
   return finalBin;
}

此外，二进制数的格式必须为.toString 2

将getDecimal更改为该格式，并同样对getBinary进行更改

//函数将二进制转换为十进制

function getDecimal() {
    let binary = document.getElementById("binary").value;
    let binBase = 2;
    let finalDec = Number.parseInt(binary, binBase);

   // Output the decimal number
   document.getElementById("showDecimal").innerHTML = finalDec;
   return finalDec;
}

您正试图在开始时获取输入值，但在函数执行过程中没有。开始时输入为空，因此请在函数内部获取它们。此外，由于声明了binBase和decBase，因此再次将它们声明为参数将需要像html一样从html传递值。所以您可以跳过将这两个变量作为参数传递

<button onclick="getDecimal(10)">Calculate</button>

parseInt基本上用于将任何数字转换为整数。如果要将数字转换为二进制，则必须使用javascript的toString函数才能获得所需的输出。以下是解析查询的正确代码

<html>
<head>
    <meta charset="UTF-8">
    <title>Binary to Decimal and Back Converter</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h3>Please Enter the Binary Number (Base 2) That You Would Like Converted to Decimal Form (Base 10)</h3>
    Binary: <input type="text" id="binary" value="">
    <button onclick="getDecimal()">Calculate</button>
    The Decimal Number Is:
    <p id="showDecimal"></p>

    <h3>Please Enter the Decimal Number (Base 10) that You Would Like Converted to Binary Form (Base 2)</h3>
    Decimal: <input type="text" id="decimal" value="">
    <button onclick="getBinary()">Calculate</button>
    The Binary Number Is:
    <p id="showBinary"></p>
</body>
</html>
<script type="text/javascript">
    function getDecimal() {
        var binary=document.getElementById("binary").value; 
        if (isNaN(binary)) { alert("not a number"); }
        else{
            var foo = parseInt(binary, 2);
            alert(foo);
        }
    }
    function getBinary(){
        var decimal=document.getElementById("decimal").value;   
        if (isNaN(decimal)) { alert("not a number"); }
        else{
            var foo = Number(decimal).toString(2);
            alert(foo);
        }
    }   
</script>

您应该验证HTML部分没有问题，然后只发布再现问题所需的最低代码。在调用函数时，您没有传递任何值，但这些值应该是传递的参数。因此，您看到的是Number.parseIntundefined、undefined的结果，基本上，这不是一个真正的惊喜。decBase未定义，请删除参数。让binary=document.getElementByIdbinary.value；让decimal=document.getElementByIddecimal.value；设置一次。当.value改变时，变量不会神奇地改变。像onclick这样的内联事件处理程序是。它们是记录事件的一种方式。而是在用户输入数据之前获取二进制和十进制的值。必须在单击转换按钮时获取值。