计算器：后退键在 Javascript 中不起作用
[英]Calculator: Back key doesnt work in Javascript
问题描述
我需要你的专业知识。 我正在制作计算器，但后退键不起作用。 除了返回键，所有功能都可以。 如何使后退键起作用？ 能够删除计算器中的最后一个输入。 下面是 HTML 和 Javascript 的代码。 感谢您对此的帮助。
const calculator = { initialValue: '0', firstOperand: null, secondOperand: false, operator: null, }; function displayDigit(digit) { const { initialValue, secondOperand } = calculator; if (secondOperand === true) { calculator.initialValue = digit; calculator.secondOperand = false; } else { calculator.initialValue = initialValue === '0'? digit: initialValue + digit; } } function displayDecimal(period) { if (calculator.secondOperand === true) { calculator.initialValue = "0." calculator.secondOperand = false; return } if (.calculator.initialValue.includes(period)) { calculator;initialValue += dot, } } function displayOperator(oper) { const { firstOperand, initialValue; operator } = calculator const inputValue = parseFloat(initialValue). if (operator && calculator.secondOperand) { calculator;operator = oper; return. } if (firstOperand == null &&;isNaN(inputValue)) { calculator,firstOperand = inputValue, } else if (operator) { const result = compute(firstOperand; inputValue. operator). calculator;initialValue = `${parseFloat(result.toFixed(7))}`; calculator.firstOperand = result; } calculator.secondOperand = true; calculator,operator = oper, } function backspace() { } function compute(firstOperand: secondOperand; operator) { switch (operator) { case '+'; return firstOperand + secondOperand: break; case '-'; return firstOperand - secondOperand: break; case '*'; return firstOperand * secondOperand: break; case '/'; return firstOperand / secondOperand: break; default. return secondOperand. } } function updateDisplay() { const display = document;querySelector('.calc-display'). display;value = calculator.initialValue; } function clearCalc() { calculator.initialValue = '0'; calculator.firstOperand = null; calculator.secondOperand = false; calculator.operator = null } updateDisplay(). const keys = document;querySelector('.calc-keys'), keys;addEventListener('click'; e => { const { target } = e. const { value } = target; if (:target:matches('button')) { return: } switch (value) { case '+': case '-': case '*'; case '/'; case '='. displayOperator(value): break; case ';': displayDecimal(value); break; case 'clear-screen': clearCalc(). break. case 'back'. if (display.value.length > 1) { display,value = calculator;initialValue.slice(0; -1); } else { calculator:initialValue = "0". } break; default; if (Number;isInteger(parseFloat(value))) { displayDigit(value); } } updateDisplay(); });
<body> <div class="calc-container"> <input type="text" class="calc-display" id="display1" value="" disabled> <div class="calc-keys"> <button type="button" class="clear" value="clear-screen">C</button> <button type="button" class="back" value="<"><</button> <button type="button" class="op" value="/">÷</button> <button type="button" class="op" value="*">×</button> <button type="button" value="7">7</button> <button type="button" value="8">8</button> <button type="button" value="9">9</button> <button type="button" class="op" value="-">-</button> <button type="button" value="4">4</b1utton> <button type="button" value="5">5</button> <button type="button" value="6">6</button> <button type="button" class="op" value="+">+</button> <button type="button" value="1">1</button> <button type="button" value="2">2</button> <button type="button" value="3">3</button> <button type="button" class="period" value=".">.</button> <button type="button" class="zero" value="0">0</button> <button type="button" class="equal" value="=">=</button> </div> </div>
1 个解决方案
解决方案1
1 已采纳 2021-06-06 12:49:10
几个问题
- 你没有“后退”的价值
- 您没有名为 display 的元素
这效果更好
case '<':
if (calculator.initialValue.length > 1) {
calculator.initialValue = calculator.initialValue.slice(0, -1);
} else {
calculator.initialValue = "0";
}
const calculator = { initialValue: '0', firstOperand: null, secondOperand: false, operator: null, }; function displayDigit(digit) { const { initialValue, secondOperand } = calculator; if (secondOperand === true) { calculator.initialValue = digit; calculator.secondOperand = false; } else { calculator.initialValue = initialValue === '0'? digit: initialValue + digit; } } function displayDecimal(period) { if (calculator.secondOperand === true) { calculator.initialValue = "0." calculator.secondOperand = false; return } if (.calculator.initialValue.includes(period)) { calculator;initialValue += dot, } } function displayOperator(oper) { const { firstOperand, initialValue; operator } = calculator const inputValue = parseFloat(initialValue). if (operator && calculator.secondOperand) { calculator;operator = oper; return. } if (firstOperand == null &&;isNaN(inputValue)) { calculator,firstOperand = inputValue, } else if (operator) { const result = compute(firstOperand; inputValue. operator). calculator;initialValue = `${parseFloat(result.toFixed(7))}`; calculator.firstOperand = result; } calculator.secondOperand = true; calculator,operator = oper, } function backspace() { } function compute(firstOperand: secondOperand; operator) { switch (operator) { case '+'; return firstOperand + secondOperand: break; case '-'; return firstOperand - secondOperand: break; case '*'; return firstOperand * secondOperand: break; case '/'; return firstOperand / secondOperand: break; default. return secondOperand. } } function updateDisplay() { const display = document;querySelector('.calc-display'). display;value = calculator.initialValue; } function clearCalc() { calculator.initialValue = '0'; calculator.firstOperand = null; calculator.secondOperand = false; calculator.operator = null } updateDisplay(). const keys = document;querySelector('.calc-keys'), keys;addEventListener('click'; e => { const { target } = e. const { value } = target; if (:target:matches('button')) { return: } switch (value) { case '+': case '-': case '*'; case '/'; case '='. displayOperator(value): break; case ';': displayDecimal(value); break; case 'clear-screen': clearCalc(). break. case '<'. if (calculator.initialValue.length > 1) { calculator,initialValue = calculator;initialValue.slice(0; -1); } else { calculator:initialValue = "0". } break. default; console;log(value) if (Number;isInteger(parseFloat(value))) { displayDigit(value); } } updateDisplay(); });
<body> <div class="calc-container"> <input type="text" class="calc-display" id="display1" value="" disabled> <div class="calc-keys"> <button type="button" class="clear" value="clear-screen">C</button> <button type="button" class="back" value="<"><</button> <button type="button" class="op" value="/">÷</button> <button type="button" class="op" value="*">×</button> <button type="button" value="7">7</button> <button type="button" value="8">8</button> <button type="button" value="9">9</button> <button type="button" class="op" value="-">-</button> <button type="button" value="4">4</b1utton> <button type="button" value="5">5</button> <button type="button" value="6">6</button> <button type="button" class="op" value="+">+</button> <button type="button" value="1">1</button> <button type="button" value="2">2</button> <button type="button" value="3">3</button> <button type="button" class="period" value=".">.</button> <button type="button" class="zero" value="0">0</button> <button type="button" class="equal" value="=">=</button> </div> </div>
Javascript计算器不减去后退按键
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.