扩展单选框选中判断脚本时类添加/移除失效，求排查原因

安全阿岳

2026-5-15

问题分析与解决方案

你的代码问题出在if/else语句的块语法上，这是JavaScript里很容易踩的小坑！

具体原因

当else后面需要执行多条语句时，必须用大括号{}把这些语句包裹成一个代码块。看你扩展后的代码：

else
    document.getElementById('ifYes').style.display = 'none';
    document.getElementById('billing:postcode_input:output').classList.remove('business');

这里没有大括号，JavaScript只会把紧跟在else后面的第一条语句（也就是隐藏ifYes区块的那行）归为else的执行内容，而第二条移除类的语句会被当成独立代码，不管单选按钮是否选中，每次调用函数时都会执行。这就导致：哪怕你选中了yesCheck，刚给元素加上business类，立刻又被移除了，看起来类的操作完全没生效。

修正后的代码

把else块的两条语句用大括号包裹，同时可以优化一下代码（缓存DOM元素，避免重复查询）：

function yesnoCheck() {
    // 缓存DOM元素，避免重复查询提升性能
    const yesCheck = document.getElementById('yesCheck');
    const ifYesBlock = document.getElementById('ifYes');
    const postcodeOutput = document.getElementById('billing:postcode_input:output');

    if (yesCheck.checked) {
        ifYesBlock.style.display = 'block';
        postcodeOutput.classList.add('business');
    } else {
        // 用大括号包裹else的所有执行语句
        ifYesBlock.style.display = 'none';
        postcodeOutput.classList.remove('business');
    }
}