为什么javascript和html代码没有计算结果？_Javascript_Html_Math

为什么javascript和html代码没有计算结果？

javascript html math

为什么javascript和html代码没有计算结果？,javascript,html,math,Javascript,Html,Math,代码如下： <html> <body> <script> function myFunction(var1,var2){ number=var1+var2 document.write(number) } </script> <form> Number 1 : <input type="text" name="no1"><br> Number 2 : <input type="text" name="n

代码如下：

<html>
<body>

<script>
function myFunction(var1,var2){
number=var1+var2
document.write(number)
}
</script>

<form>
Number 1 : <input type="text" name="no1"><br>
Number 2 : <input type="text" name="no2"><br>
<input type="button" onclick="myFunction(this.form.no1.value,this.form.no2.value)" value="submit">
</form>

<p id="demo></p

</body>
</html>

但我希望它显示30。我能做什么

**我尝试了myFunction（10,20），结果是30。

两个选项：

将输入标记更改为

<input type="button" onclick="myFunction(parseInt(this.form.no1.value, 10),parseInt(this.form.no2.value, 10))" value="submit">

使用parseInt修改函数，如：

<script>
    function myFunction(var1,var2){
        number=parseInt(var1)+parseInt(var2);
        document.write(number);
    }
</script>


函数myFunction（var1，var2）{
number=parseInt（var1）+parseInt（var2）；
文件。书写（编号）；
}

您得到的输出类似于

，因为默认情况下，文本框中的数据被视为

文本类型

，因此我们需要首先将其转换为

数字类型

，因为我们正在使用

parseInt

（用于显式转换）

将您的方法更新为

function myFunction(var1,var2){
  number=parseInt(var1) + parseInt(var2)
  document.write(number)
}

由于

this.form.no1.value

返回一个字符串，因此这两个数字都作为字符串连接起来，而不是作为数字求和。

这是因为从输入字段提取的值是字符串。添加两个字符串时，它们通常是串联的。按照Evan在评论中的建议，尝试查看javascript方法

parseInt

，或者如果希望允许浮动，请查看

parseFloat

然后，您的方法将如下所示：

function myFunction(var1,var2){
    number = parseFloat(var1) + parseFloat(var2)
    document.write(number)
}

您的javascript认为您正在添加字符串。。。为了确保您的javascript知道您使用的数字，您需要将其转换为该类型

<html>
    <body>
        <script>
        function myFunction(var1, var2){
            number = parseInt(var1, 10) + parseInt(var2, 10)
            document.write(number)
        }
        </script>
        <form>
            Number 1 : <input type="text" name="no1"><br>
            Number 2 : <input type="text" name="no2"><br>
            <input type="button" onclick="myFunction(this.form.no1.value,this.form.no2.value)" value="submit">
        </form>

        <p id="demo"></p>
    </body>
</html>


函数myFunction（var1，var2）{
number=parseInt（var1，10）+parseInt（var2，10）
文件。写入（编号）
}
第一名：

第二条：

有关parseInt的更多信息，请检查此项。

现在只是字符串连接。请使用“parseInt（）”获取结果

谢谢。

您没有进行计算，而是添加了两个字符串。为了计算var1+var2的数学答案，应该将它们解析为整数

result = parseInt(var1) + parseInt(var2);

只需使用

parseInt（）

方法将变量值解析为整数，或者在变量名之前添加“+”。因为变量var1和var2返回字符串。要计算这些变量值，需要将其转换为整数
使用parseInt（）方法

number=parseInt(var1)+parseInt(var2)
在变量名之前使用+转换为整数，

number= +var1 + +var2
试试这个代码

<html> <body> <script> function myFunction(var1,var2){ number = parseInt(var1) + parseInt(var2) //another way number= +var1+ +var2 document.write(number) } </script> <form> Number 1 : <input type="text" name="no1"><br> Number 2 : <input type="text" name="no2"><br> <input type="button" onclick="myFunction(this.form.no1.value,this.form.no2.value)" value="submit"> </form> <p id="demo"></p> </body> </html>

函数myFunction（var1，var2）{ number=parseInt（var1）+parseInt（var2） //另一种方式编号=+var1++var2 文件。写入（编号） } 第一名：第二条：
使用parseInt（）

在变量名之前使用+查找
parseInt
方法。@EvanTrimboli:
number=+var1++var2
也能工作，尽管它很粗糙，可读性也不如
parseInt（）
那么好。它会的，但OP似乎才刚刚开始，所以“魔法”越少越好。好吧，我至少会给其他人+1，因为有更多的人想出了相同的答案。谢谢。+1，为了便于提及，一个简短的隐式转换应该是：
number=+var1++var2（符号之间的空格很重要），即：“2”+“3” 是“23” ，而+“2”+“3” 是5 。尽管parseInt（）偏离了正确的方向。 number= +var1 + +var2 <html> <body> <script> function myFunction(var1,var2){ number = parseInt(var1) + parseInt(var2) //another way number= +var1+ +var2 document.write(number) } </script> <form> Number 1 : <input type="text" name="no1"><br> Number 2 : <input type="text" name="no2"><br> <input type="button" onclick="myFunction(this.form.no1.value,this.form.no2.value)" value="submit"> </form> <p id="demo"></p> </body> </html>