计算器JavaScript逻辑异常:点击运算符后无法输入数字
计算器JavaScript逻辑异常:点击运算符后无法输入数字
我仔细扒了你的代码,找到几个关键问题,正是它们导致点击运算符后数字输不进去,咱们一个个说:
1. equivalentCheck函数里的致命错误
这是最核心的问题!你看这段代码:
document.getElementById('equivalent') = 0;
你直接把equivalent这个DOM元素赋值成了0,而不是修改它的value属性!这会直接把页面上的这个隐藏输入框元素给替换成数值0,后续再想获取它的时候就会出错,直接导致input函数执行到这一步就卡壳,后面的数字输入逻辑根本跑不起来。
正确的写法应该是修改它的value,同时优化判断逻辑(用字符串比较避免类型转换意外),顺便加上重置小数点状态:
function equivalentCheck() { // 运算后保持结果,直到其他按钮被点击 const equivalentEl = document.getElementById('equivalent'); if (equivalentEl.value === "1") { equivalentEl.value = "0"; document.getElementById('result').value = "0"; // 重置小数点标记,避免之前的小数状态干扰新输入 document.getElementById('decimalVar').value = "0"; } }
2. 点击运算符后未重置小数点状态
你点击运算符后,decimalVar的数值没有被重置,如果之前输入过小数,它的值会大于0,下次输入数字时会直接进入小数分支,导致输入逻辑混乱。上面修改后的equivalentCheck已经帮你补上了这一步。
3. input函数的逻辑优化
原函数里的变量处理有点绕,比如x += y * 10容易搞混变量含义,改成更直观的写法,同时缓存DOM元素减少重复查找:
function input(x) { equivalentCheck(); const resultEl = document.getElementById('result'); const decimalVarEl = document.getElementById('decimalVar'); let currentResult = resultEl.value; if (decimalVarEl.value === "0") { // 非小数状态:拼接数字(比如当前是5,点击3变成53) let newVal = parseFloat(currentResult) * 10 + x; resultEl.value = newVal.toString(); } else { // 小数状态:处理小数点后的数字 let decimalCount = parseInt(decimalVarEl.value); if (decimalCount === 1) { // 第一次输入小数位:比如当前是5,点击3变成5.3 let newVal = parseFloat(currentResult) + x / 10; resultEl.value = newVal.toString(); } else { // 后续小数位直接追加 resultEl.value += x.toString(); } decimalVarEl.value = (decimalCount + 1).toString(); } }
4. 其他小细节优化
比如operandCheck里的判断,用字符串比较代替parseInt会更可靠,避免空字符串转成0的意外:
function operandCheck() { const operandEl = document.getElementById('operand'); const resultEl = document.getElementById('result'); const equivalentEl = document.getElementById('equivalent'); if (operandEl.value === "") { operandEl.value = resultEl.value; equivalentEl.value = "1"; } else { operatorCheck(); } }
把这些修改完再测试:点击数字→运算符→数字,应该就能正常输入了。核心问题就是那个DOM元素赋值的低级错误,导致整个输入逻辑崩溃,加上状态重置不完整的小问题,就出现了你遇到的现象。
备注:内容来源于stack exchange,提问作者V. M. Ent
相关产品推荐
相关产品推荐

