基础计算器APP小数点丢失问题：输入2.5被识别为25的解决求助

你的问题核心在于数字拼接逻辑只适配整数，完全忽略了小数的存在：当你输入小数点后继续输入数字时，代码仍用num = num * 10 + 新数字的整数运算逻辑处理，直接把小数部分当成整数拼接，导致小数点丢失（比如2.5被处理成2*10+5=25）。

关键错误点 #

1. 用num1/num2变量直接拼接数字，而非维护输入框的字符串内容，小数输入后无法正确保留格式
2. 点击运算符时直接把输入框设为运算符符号，丢失了num1的输入状态（后续输入num2时无法正确识别初始输入）

修改后的完整代码 #

const inputField = document.querySelector("#inputField");
const container = document.querySelector(".main-container");
const allClear = document.querySelector("#all-clear");
const switchButton = document.querySelector("#switch");

allClear.addEventListener("click", clear);
switchButton.addEventListener("click", change);
container.addEventListener("click", handleClick);

function clear() {
    inputField.value = "0";
}

function change() {
    let inputValue = parseFloat(inputField.value);
    inputField.value = inputValue < 0 ? Math.abs(inputValue) : -Math.abs(inputValue);
}  

let operator = "";
let num1 = null;

function handleClick(event) {
    const clickedButton = event.target;
    const clickedValue = clickedButton.textContent;

    // 处理数字和小数点按钮
    if (!isNaN(clickedValue) || clickedValue === ".") {
        // 初始状态（显示0）或刚选完运算符时，直接替换为点击的数字/小数点
        if (inputField.value === "0" || inputField.value === operator) {
            inputField.value = clickedValue === "." ? "0." : clickedValue;
        } else {
            // 非初始状态，追加内容（小数点需判断是否已存在）
            if (clickedValue === ".") {
                if (!inputField.value.includes(".")) {
                    inputField.value += clickedValue;
                }
            } else {
                inputField.value += clickedValue;
            }
        }
    }

    // 处理运算符按钮
    if (["+", "-", "*", "/", "%"].includes(clickedValue)) {
        // 只有当num1未初始化时，才从输入框读取值
        if (num1 === null) {
            num1 = parseFloat(inputField.value);
        }
        operator = clickedValue;
        // 保留输入框显示已输入的num1，方便用户确认
        // 若需要清空输入框，可替换为 inputField.value = "";
    }

    // 处理等号按钮
    if (clickedValue === "=") {
        if (num1 !== null && operator !== "" && inputField.value !== operator) {
            const num2 = parseFloat(inputField.value);
            let result;
            switch (operator) {
                case "+":
                    result = num1 + num2;
                    break;
                case "-":
                    result = num1 - num2;
                    break;
                case "*":
                    result = num1 * num2;
                    break;
                case "/":
                    result = num2 !== 0 ? num1 / num2 : "Error";
                    break;
                case "%":
                    result = num1 % num2;
                    break;
            }
            inputField.value = result;
            num1 = result;
            operator = "";
        }
    }
}

核心改动说明 #

• 放弃用数字变量拼接输入：直接维护输入框的字符串内容，确保小数格式不会被破坏
• 优化初始状态处理：输入框显示0或运算符时，点击数字/小数点直接替换，避免多余前缀
• 运算符点击逻辑调整：先将当前输入框的值赋值给num1，再记录运算符，保留输入框内容提升用户体验
• 增加除零错误判断：避免除法运算时出现无限大的错误结果

内容的提问来源于stack exchange，提问作者Nursultan Sagynbek