Question

我正在寻找一种计算两个数字的方法，当我在value =“”中添加字符串并计算时，这两个数字中的每一个在诸如“ dolar”或“ meter”之类的文本框中旁边都有一个字符串。得到此消息：NaN

这是我的代码：

GlobalExceptionHandler

function myFunction() {
  var y1 = document.getElementById("text1").value;
  var y2 = document.getElementById("text2").value;
  var x = Number(y1) + Number(y2);
  document.getElementById("demo").value = x;
}

Answer 1

Number()构造函数将拒绝不是完全数字的输入字符串，在这种情况下将返回NaN。

但是，所有操作并没有丢失：parseFloat()函数在获取不属于数字的文本时只是停止解析，因此将像"127.45 pounds"这样的字符串解析为数字{{ 1}}。

Answer 2

anater mj，当用户离开输入字段时，将执行onblur方法。您将得到的是，当用户离开一个输入字段并且尚未在另一个输入字段中写入任何值时，将调用myFunction方法，但是其中一个输入字段的值将无法被调用。转换为数字，因为其值未定义。

我建议您添加一个按钮来执行myFunction或在您的代码中添加一个防御性子句以首先检查输入字段的值。

Answer 3

我要补充一点，您输入的数字input没有ID，而您用document.getElementById("text1")引用它们。将引用的ID添加到输入中，或使用getElementsByName

Answer 4

根据我的理解，此功能将为您提供所需的信息。可能并不完美，但似乎符合您的需求。注意，大多数html代码与上面提供的相同。该代码接受两个输入（例如，text1 =“ 2米”和text2 =“ 3米”）解析字符串的数字部分，添加数字，并在演示字段中显示答案（例如，“ 5”）：

    <html>
    <head>
    <script type='text/javascript'>
    function myFunction() {
        var y1 = parseFloat(document.getElementById("text1").value);
        var y2 = parseFloat(document.getElementById("text2").value);

        if ( !isNaN(y1) && !isNaN(y2) )
        {    

            document.getElementById("demo").value = (y1 + y2);
        }
        else 
        {
            if (document.getElementById("demo").value.length > 0)
                document.getElementById("demo").value = ""  
        }
    }

    </script>
    <body>
    <p>
    Enter first number:
    <input type="text" size="10" id="text1" onblur="myFunction()"> Enter second number:
    <input type="text" size="10" id="text2" onblur="myFunction()">  
    </p>
    <input type="text" id="demo" name="demo" size="10" value="">
    </html>

Answer 5

如果该字段具有任何非数值，那么我们将获得NaN。 “ Not a Number”的缩写。

如果该字段仅包含整数，则在下面使用

var x = parseInt(y1) + parseInt(y2);

如果是浮点数，则

var x = parseFloat(y1) + parseFloat(y2);

用字符串加两个数字

5 个答案: