简体   繁体   English

我如何获得自己的意见以不断增加价值

[英]how do i get my input to keep adding values

 $(onReady); function onReady() { console.log('log inside of onReady'); $(".calculatorNum").on('click', buttonClicked); }//end of onReady function buttonClicked() { console.log('buttonClicked'); var input = $("#inputField").val($(this).text()); input += input; } 
 button { height:30px; width:30px } #clearButton{ width:64px } #inputField{ margin-bottom: .5em; height:2em; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Calculator</title> <link rel="stylesheet" href="styles/style.css"> <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script> <script src="scripts/scripts.js" charset="utf-8"></script> </head> <body> <h1>Calculator</h1> <div class="numContainer"> <input id = 'inputField' type="text" placeholder="input"> <br> <button class ='calculatorNum' type="button" name="button">1</button> <button class ='calculatorNum' type="button" name="button">2</button> <button class ='calculatorNum' type="button" name="button">3</button> <button id = 'addButton' class ='calculatorNum' type="button" name="button">+</button> <br> <button class ='calculatorNum' type="button" name="button">4</button> <button class ='calculatorNum' type="button" name="button">5</button> <button class ='calculatorNum' type="button" name="button">6</button> <button id = 'subButton' class ='calculatorNum' type="button" name="button">-</button> <br> <button class ='calculatorNum' type="button" name="button">7</button> <button class ='calculatorNum' type="button" name="button">8</button> <button class ='calculatorNum' type="button" name="button">9</button> <button id = 'multButton' class ='calculatorNum' type="button" name="button">X</button> <br> <button id = 'clearButton' class ='calculatorNum' type="button" name="button">Clear</button> <button class ='calculatorNum' type="button" name="button">/</button> <button class ='calculatorNum' type="button" name="button">=</button> </div> <!-- <button id = 'addButton' class ='calculatorButton' type="button" name="button">+</button> <button id = 'subButton' class ='calculatorButton' type="button" name="button">-</button> <button id = 'multButton' class ='calculatorButton' type="button" name="button">X</button> <button id = 'divButton' class ='calculatorButton' type="button" name="button">/</button> --> </body> </html> 

I want that everytime i click on a button, in the input field it keeps adding values according to the text of the button i clicked. 我希望每次单击按钮时,它都会在输入字段中根据我单击的按钮的文本不断添加值。

You probably need a global variable: 您可能需要一个全局变量:

var input="";
function buttonClicked() {
console.log('buttonClicked');
$("#inputField").val((input+=$(this).text()));
}

Some explanations: 一些解释:

Youre declaring the input variable inside of buttonClicked. 您在buttonClicked内部声明了输入变量。 Therefore it is garbage collected after the function has run, so input is lost after each click. 因此,该函数运行后会被垃圾回收,因此每次单击后输入都会丢失。 If you want to prevent this, make input global trough declaring it in the global scope. 如果要防止这种情况,请在全局范围内使输入全局槽声明它。 Then you can append the buttons value ( += ) to input, and show this value. 然后,您可以将按钮值(+ =)附加到输入中,并显示该值。 If you want input to be a Number, you may do: 如果希望输入为数字,则可以执行以下操作:

var input=0;
function buttonClicked() {
console.log('buttonClicked');
$("#inputField").val((input+=+$(this).text()));
}

I think you are trying this: 我认为您正在尝试这样做:

Note: Just get current value of text and add button value and resign to text. 注意:只需获取文本的当前值并添加按钮值并辞职即可。

 $(onReady); function onReady() { console.log('log inside of onReady'); $(".calculatorNum").on('click', buttonClicked); }//end of onReady function buttonClicked() { console.log('buttonClicked'); $("#inputField").val($("#inputField").val()+$(this).text()); } 
 button { height:30px; width:30px } #clearButton{ width:64px } #inputField{ margin-bottom: .5em; height:2em; } 
 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Calculator</title> <link rel="stylesheet" href="styles/style.css"> <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script> <script src="scripts/scripts.js" charset="utf-8"></script> </head> <body> <h1>Calculator</h1> <div class="numContainer"> <input id = 'inputField' type="text" placeholder="input"> <br> <button class ='calculatorNum' type="button" name="button">1</button> <button class ='calculatorNum' type="button" name="button">2</button> <button class ='calculatorNum' type="button" name="button">3</button> <button id = 'addButton' class ='calculatorNum' type="button" name="button">+</button> <br> <button class ='calculatorNum' type="button" name="button">4</button> <button class ='calculatorNum' type="button" name="button">5</button> <button class ='calculatorNum' type="button" name="button">6</button> <button id = 'subButton' class ='calculatorNum' type="button" name="button">-</button> <br> <button class ='calculatorNum' type="button" name="button">7</button> <button class ='calculatorNum' type="button" name="button">8</button> <button class ='calculatorNum' type="button" name="button">9</button> <button id = 'multButton' class ='calculatorNum' type="button" name="button">X</button> <br> <button id = 'clearButton' class ='calculatorNum' type="button" name="button">Clear</button> <button class ='calculatorNum' type="button" name="button">/</button> <button class ='calculatorNum' type="button" name="button">=</button> </div> <!-- <button id = 'addButton' class ='calculatorButton' type="button" name="button">+</button> <button id = 'subButton' class ='calculatorButton' type="button" name="button">-</button> <button id = 'multButton' class ='calculatorButton' type="button" name="button">X</button> <button id = 'divButton' class ='calculatorButton' type="button" name="button">/</button> --> </body> </html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何继续将输入字段的值添加到另一个标签中 - How do I keep adding the values of my input fields into another tag 如何让我的函数找到我的输入参数? - How do I get my function to find my input arguments? 如何清除文本输入字段中的值? - how do I clear the values in my text input fields? 如何在具有多个 forms 的视图中获取输入值 - How do i get input values in a view that has multiple forms 如何摆脱输入值的问题? - How do I get rid of problem with values in input? 如何将用户的输入值放入 JS 数组中? - How do I get a user's input values into a JS array? 在jQuery Masked Input中输入按键时,如何防止现有值向右移动? - How do I keep existing values from shifting to the right when entering keypresses into a jQuery Masked Input? 如何防止光标/插入符号在输入文本元素内移动? - How do I keep my cursor/caret from moving inside of an input text element? Forms,如果所有输入框都有值,如何让我的代码仅显示信息已提交 - Forms, How do I get my code to only display info has been submitted if all input boxes have values React - 如何从多个输入中获取值并将它们发送到我的输入? - React - How can I get the values from my multiple input and send them to my input?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM