[英]Increment input field value with jQuery
I want every time when user enter number ,print the new one + old one in console我希望每次当用户输入数字时,在控制台中打印新的 + 旧的
here is html script这是 html 脚本
<input type="number"value=""/>
<button>click</button>
my jquery code我的jQuery代码
$("button").click(function (){
var x = $("input").val();
x+=x;
console.log(x);
});
You have to initialize the value outside somewhere to keep its state. 您必须在某处外部初始化值以保持其状态。
html HTML
<input type="number" id="inp" value=""/>
<button>click</button>
js JS
var x = 0;
$("button").click(function (){
var y = parseInt($("#inp").val());
x+=y;
console.log(x);
});
hope this will help to you. 希望这对你有所帮助。 refer the working demo.
参考工作演示。
var thevalue = 0; $("#click").click(function(){ $("#display").text("The Value is :"); var theinput_value = parseInt($("#num").val()); thevalue += theinput_value; $("#display").append(thevalue); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> Enter the nubmer : <input type="number" id="num"><button id="click">Click on me !</button> <br> <p id="display">The Value is :</p>
Hello and welcome to the stackoverflow community. 您好,欢迎来到stackoverflow社区。
You are trying to add the input to the variable x
, but the first time your code is executed the value of x
is "", an empty string. 您正在尝试将输入添加到变量
x
,但是第一次执行代码时, x
值为“”,即空字符串。
Basically you are saying something like, hey javascript, what is 5+""? 基本上你说的是,嘿javascript,什么是5+“”?
If you run console.log(typeof (""+5));
如果你运行
console.log(typeof (""+5));
the output is string
. 输出是
string
。 That means that you were intended to get a number and ended up with a string due to not initializing x
. 这意味着你打算得到一个数字,最后得到一个字符串,因为没有初始化
x
。
Also, x
is defined in the scope of the on click function. 此外,
x
在点击功能的范围内定义。 This means that after the function is executed there is no x
at all, so when you click again and the function is executed again, x
is created again. 这意味着在执行该函数后根本没有
x
,因此当您再次单击并再次执行该函数时,将再次创建x
。
In order to fix that, just declare x
outside the scope of the function. 为了解决这个问题,只需在函数范围之外声明
x
。
var x = 0; $("button").click(function (){ // get the input value of the box var input_value = $("input").val(); // parse the value to an integer var number = parseInt(input_value) || 0; // add it to the existing value of x x = x + number; // show the results console.log(x + ' - ' + typeof x); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="number" value=""/> <button>click</button>
You just need to make sure x is a global variable so you can save it's value and used each time the click handler is triggered. 您只需要确保x是一个全局变量,这样您就可以保存它的值,并在每次触发单击处理程序时使用。
I added input casting to avoid string concatenation when using the addition assignment operator . 我使用添加赋值运算符时添加了输入转换以避免字符串连接。
var x = 0;
$("button").click(function (){
// Get the input
var current_input = parseInt($("input").val());
// If input is not a number set it to 0
if (isNaN(current_input)) current_input = 0;
// Add the input to x
x+=current_input;
// Display it
console.log(x);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.