为什么JS函数CalcularNacionalizacion内的成本计算公式不生效？

• 拼写错误：Nacional 分支中 document.getElemenById 拼写错误，缺失字母t，正确写法为 document.getElementById，该错误会触发JS异常，阻断函数执行。
• 变量重复声明冲突：函数开头已经用var fob、var Nacionalizacion声明变量存储DOM元素，else分支又重新声明同名变量存储输入值，导致变量覆盖逻辑混乱。
• 禁用属性赋值不规范：disabled是布尔类型属性，解除禁用应该赋值false而非空字符串，部分浏览器对空字符串的识别存在兼容问题，会导致输入框无法正常启用。
• 缺少非法值判断：输入框为空或输入非数字内容时，parseFloat会返回NaN，填充到输入框会表现为计算失效。
• 冗余错误绑定：costUSD输入框的onchange绑定了不存在的函数ToCalcularNacionalizaciondas，触发时会抛出异常。

首先替换原有JS逻辑，修正上述问题：

function CalcularNacionalizacion(){
    // 变量加El后缀区分DOM元素和数值，避免命名冲突
    const tipoCompraEl = document.getElementById('tipoCompra');
    const fobEl = document.getElementById('fob');
    const nacFactorEl = document.getElementById('nacFactor');
    const costNacionalizacionEl = document.getElementById('costNacionalizacion');
    const costUSDEl = document.getElementById('costUSD');

    const tipoCompra = tipoCompraEl.value;

    if (tipoCompra === 'Nacional'){
        fobEl.disabled = true;
        nacFactorEl.disabled = true;
        costNacionalizacionEl.disabled = true;
    } else if (tipoCompra === 'Exterior') {
        // 用布尔值规范设置禁用状态
        fobEl.disabled = false;
        nacFactorEl.disabled = false;
        costNacionalizacionEl.disabled = false;

        // 空值默认转0避免出现NaN
        const fobVal = parseFloat(fobEl.value) || 0;
        const nacFactorVal = parseFloat(nacFactorEl.value) || 0;
        const nacionalizacionVal = fobVal * nacFactorVal;

        // 保留两位小数可根据业务需求调整
        costNacionalizacionEl.value = nacionalizacionVal.toFixed(2);
        const totalUSD = fobVal + nacionalizacionVal;
        costUSDEl.value = totalUSD.toFixed(2);
    } else {
        // 未选择采购类型时默认禁用关联字段
        fobEl.disabled = true;
        nacFactorEl.disabled = true;
        costNacionalizacionEl.disabled = true;
    }
}

再修正HTML中costUSD输入框的错误事件绑定：

<div class="form-group col-md-2">
    <label for="costUSD">Costo total en USD-O</label>
    <input type="number" step="0.01" name="costUSD" class="form-control" id="costUSD" onkeyup="CalcularNacionalizacion();" required>
</div>

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