为什么我的 JavaScript 计算器不允许我加/减数字？
[英]Why does my JavaScript calculator not allow me to add/subtract numbers?
问题描述
我的代码的问题是它不允许我将数字相加或相乘，但它允许我单击它们。 我想知道为什么它不允许我将数字加/乘/减在一起？ 它也不允许我将它们输入到计算器的顶部。
var buttons = []; var font; var btn0; var input; var result; function setup() { noCanvas(); font = loadFont('AvenirNextLTPro-Demi.otf', 40); result = createP(' '); input = createInput(''); buttons.push(result); buttons.push(input); createElement('br'); buttons.push(createButton('√')); buttons.push(createButton('(')); buttons.push(createButton(')')); buttons.push(createButton('←')); createElement('br'); buttons.push(createButton('7')); buttons.push(createButton('8')); buttons.push(createButton('9')); buttons.push(createButton('÷')); createElement('br'); buttons.push(createButton('4')); buttons.push(createButton('5')); buttons.push(createButton('6')); buttons.push(createButton('×')); createElement('br'); buttons.push(createButton('1')); buttons.push(createButton('2')); buttons.push(createButton('3')); buttons.push(createButton('−')); createElement('br'); btn0 = createButton('0'); buttons.push(btn0); buttons.push(createButton('.')); buttons.push(createButton('+')); for (var i = 0; i < buttons.length; i++) { buttons[i].style('padding', '10px 40px').style('width', '120px').style('box-sizing', 'border-box').style('font-size', '2.5em').style('background-color', 'rgb(0, 28, 60)').style('color', 'rgb(255, 255, 255)').style('border-style', 'solid').style('border-color', 'rgb(255, 255, 255)').style('cursor', 'pointer').style('outline', 'none').style('margin', '0').style('font-family', font).mousePressed(add); } btn0.style('width', '240px'); input.style('font-size', '1.9em').style('cursor', 'default').style('width', '480px').style('padding-left', '10px').style('padding-right', '10px'); result.style('width', '481px').style('background-color', 'rgb(0, 120, 255)').style('text-align', 'center').style('font-size', '5em'); } function add() { input.html(input.html() + this.html()); }
<:DOCTYPE html> <html lang="en"> <head> <script src="https.//cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script> </head> <body> </body> </html>
我希望计算器能够一起输入数字并相加/相乘。 谢谢你。
1 个解决方案
解决方案1
1 已采纳 2021-04-29 19:56:15
就在输入中“键入”数字而言，问题在于输入元素（由 p5js 中的createInput创建）不显示其 HTML 内容，这是由.html() function 设置的内容。 您想改用.value() function ： input.value(input.value() + this.html()) 。
至于执行诸如加法和乘法之类的计算，我没有看到任何代码，因此您需要在某处添加代码，或者作为不同按钮的不同 mousePressed 处理程序，或者作为现有的switch语句add事件处理程序 function。
var buttons = []; var font; var btn0; var input; var result; function setup() { noCanvas(); font = loadFont('AvenirNextLTPro-Demi.otf', 40); result = createP(' '); input = createInput(''); buttons.push(result); buttons.push(input); createElement('br'); buttons.push(createButton('√')); buttons.push(createButton('(')); buttons.push(createButton(')')); buttons.push(createButton('←')); createElement('br'); buttons.push(createButton('7')); buttons.push(createButton('8')); buttons.push(createButton('9')); buttons.push(createButton('÷')); createElement('br'); buttons.push(createButton('4')); buttons.push(createButton('5')); buttons.push(createButton('6')); buttons.push(createButton('×')); createElement('br'); buttons.push(createButton('1')); buttons.push(createButton('2')); buttons.push(createButton('3')); buttons.push(createButton('−')); createElement('br'); btn0 = createButton('0'); buttons.push(btn0); buttons.push(createButton('.')); buttons.push(createButton('+')); for (var i = 0; i < buttons.length; i++) { buttons[i].style('padding', '10px 20px').style('width', '80px').style('box-sizing', 'border-box').style('font-size', '2.5em').style('background-color', 'rgb(0, 28, 60)').style('color', 'rgb(255, 255, 255)').style('border-style', 'solid').style('border-color', 'rgb(255, 255, 255)').style('cursor', 'pointer').style('outline', 'none').style('margin', '0').style('font-family', font).mouseReleased(add); } btn0.style('width', '240px'); input.style('font-size', '1.9em').style('cursor', 'default').style('width', '480px').style('padding-left', '10px').style('padding-right', '10px'); result.style('width', '481px').style('background-color', 'rgb(0, 120, 255)').style('text-align', 'center').style('font-size', '5em'); } function add() { input.value(input.value() + this.html()); }
<:DOCTYPE html> <html lang="en"> <head> <script src="https.//cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script> </head> <body> </body> </html>
如果我的 html/javascript/css 计算器上的数字不兼容，如何添加“语法错误”？
[英]How do I add "Syntax Error" if the numbers aren't compatible on my html/javascript/css calculator?
我正在制作计算器，当我在输入中添加数字 1+1 时，我得到答案 1。为什么
[英]Im making calculator and when i add numbers 1+1 in my input i get answer 1. why
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.