JavaScript个税计算器liczenie()函数计算异常问题求助

1. 先解决ID重复的核心冲突 #

同一个页面里ID必须唯一，你现在输入框和展示税前工资的元素都用了id="brutto"，调用document.getElementById('brutto')时只会返回第一个匹配的元素（也就是输入框），导致后续赋值展示税前工资时根本找不到正确的元素，这直接引发数据展示混乱。

修复方法：

• 把展示税前工资的元素ID改成brutto-display，比如：

<!-- 原展示元素 -->
<p>Brutto: <span id="brutto"></span> PLN</p>
<!-- 修改后 -->
<p>Brutto: <span id="brutto-display"></span> PLN</p>

• 在JS里读取输入值用document.getElementById('brutto').value，设置展示值用document.getElementById('brutto-display').textContent。

2. 修正计算逻辑错误 #

计算结果错误大概率是这几个原因：

• 输入的工资是字符串类型，直接参与运算会变成字符串拼接而非数值计算。读取值时必须转成数字：

const brutto = parseFloat(document.getElementById('brutto').value);
// 若为整数工资，也可用parseInt并指定基数
const brutto = parseInt(document.getElementById('brutto').value, 10);

• 检查switch语句的税率逻辑，确保每个case的税费计算正确，没有遗漏break（不需要贯穿逻辑时）或税率取值错误。示例修正后的switch逻辑：

let taxRate;
const state = document.getElementById('state').value;
switch(state) {
  case 'mazowieckie':
    taxRate = 0.19; // 示例税率19%
    break;
  case 'slaskie':
    taxRate = 0.18;
    break;
  // 补充其他州的case逻辑
  default:
    taxRate = 0.19; // 设置默认税率
}
const tax = brutto * taxRate;
const netto = brutto - tax;

• 确保计算完成后正确更新DOM元素，同时保留两位小数提升可读性：

document.getElementById('tax').textContent = tax.toFixed(2);
document.getElementById('netto').textContent = netto.toFixed(2);
document.getElementById('brutto-display').textContent = brutto.toFixed(2);

3. 完整修复后的代码示例（简化版） #

<!DOCTYPE html>
<html>
<head>
  <title>Podatek Calculator</title>
</head>
<body>
  <label>Podaj wynagrodzenie brutto: <input type="number" id="brutto" placeholder="np. 5000"></label>
  <label>Wybierz województwo:
    <select id="state">
      <option value="mazowieckie">Mazowieckie</option>
      <option value="slaskie">Śląskie</option>
    </select>
  </label>
  <button onclick="calculate()">Oblicz</button>
  
  <p>Brutto: <span id="brutto-display"></span> PLN</p>
  <p>Podatek: <span id="tax"></span> PLN</p>
  <p>Netto: <span id="netto"></span> PLN</p>

  <script>
    function calculate() {
      // 读取并校验输入值
      const brutto = parseFloat(document.getElementById('brutto').value);
      if (isNaN(brutto) || brutto <= 0) {
        alert('Wprowadź poprawne wynagrodzenie');
        return;
      }
      
      // 获取对应税率
      const state = document.getElementById('state').value;
      let taxRate;
      switch(state) {
        case 'mazowieckie':
          taxRate = 0.19;
          break;
        case 'slaskie':
          taxRate = 0.18;
          break;
        default:
          taxRate = 0.19;
      }
      
      // 计算税费与税后工资
      const tax = brutto * taxRate;
      const netto = brutto - tax;
      
      // 更新页面展示
      document.getElementById('brutto-display').textContent = brutto.toFixed(2);
      document.getElementById('tax').textContent = tax.toFixed(2);
      document.getElementById('netto').textContent = netto.toFixed(2);
    }
  </script>
</body>
</html>

内容的提问来源于stack exchange，提问作者Jan Nepomucen