jQuery jQuery从输入字段添加2个数字
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16269385/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery adding 2 numbers from input fields
提问by Rhys Heredia
I am trying to add two values of alert boxes but I keep getting a blank alert box. I don't know why.
我正在尝试添加两个警报框值，但我一直收到一个空白警报框。我不知道为什么。
$(document).ready(function(){
var a = $("#a").val();
var b = $("#b").val();
$("submit").on("click", function(){
var sum = a + b;
alert(sum);
})
})
回答by Blender
Adding strings concatenates them:
添加字符串将它们连接起来：
> "1" + "1"
"11"
You have to parse them into numbers first:
您必须首先将它们解析为数字：
/* parseFloat is used here.
* Because of it's not known that
* whether the number has fractional places.
*/
var a = parseFloat($('#a').val()),
b = parseFloat($('#b').val());
Also, you have to get the values from inside of the click handler:
此外，您必须从点击处理程序内部获取值：
$("submit").on("click", function() {
var a = parseInt($('#a').val(), 10),
b = parseInt($('#b').val(), 10);
});
Otherwise, you're using the values of the textboxes from when the page loads.
否则，您将使用页面加载时的文本框值。
回答by Rhys Heredia
<script type="text/javascript">
$(document).ready(function () {
$('#btnadd').on('click', function () {
var n1 = parseInt($('#txtn1').val());
var n2 = parseInt($('#txtn2').val());
var r = n1 + n2;
alert("sum of 2 No= " + r);
return false;
});
$('#btnclear').on('click', function () {
$('#txtn1').val('');
$('#txtn2').val('');
$('#txtn1').focus();
return false;
});
});
</script>
回答by shaggy
There are two way that you can add two number in jQuery
有两种方法可以在 jQuery 中添加两个数字
First way:
第一种方式：
var x = parseInt(a) + parseInt(b);
alert(x);
Second Way:
第二种方式：
var x = parseInt(a+2);
alert(x);
Now come your question
现在来你的问题
var a = parseInt($("#a").val());
var b = parseInt($("#b").val());
alert(a+b);
回答by chris
Use this code for adding two numbers by using jquery
使用此代码通过使用 jquery 将两个数字相加
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>HTML Tutorial</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<meta charset="windows-1252">
<script>
$(document).ready(function(){
$("#submit").on("click", function(){
var a = parseInt($('#a').val());
var b = parseInt($('#b').val());
var sum = a + b;
alert(sum);
})
})
</script>
</head>
<body>
<input type="text" id="a" name="option">
<input type="text" id="b" name="task">
<input id="submit" type="button" value="press me">
</body>
</html>
回答by Nomad101
Ok so your code actually works but what you need to do is replace a and b in your click function with the jquery notation you used before the click. This will ensure you have the correct and most up to date values. so changing your click function to this should work:
好的，所以您的代码实际上可以工作，但是您需要做的是用您在单击之前使用的 jquery 表示法替换单击函数中的 a 和 b。这将确保您拥有正确且最新的值。所以将您的点击功能更改为此应该可以工作：
$("submit").on("click", function(){
var sum = $("#a").val().match(/\d+/) + $("#b").val().match(/\d+/);
alert(sum);
})
or inlined to:
或内联到：
$("submit").on("click", function(){
alert($("#a").val().match(/\d+/) + $("#b").val().match(/\d+/));
})
回答by themhz
This code works, can you compare it with yours?
此代码有效，您能将其与您的进行比较吗？
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>HTML Tutorial</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<meta charset="windows-1252">
<script>
$(document).ready(function(){
var a = $("#a").val();
var b = $("#b").val();
$("#submit").on("click", function(){
var sum = a + b;
alert(sum);
})
})
</script>
</head>
<body>
<input type="text" id="a" name="option">
<input type="text" id="b" name="task">
<input id="submit" type="button" value="press me">
</body>
</html>
