ASP.NET MVC中CheckBoxFor绑定数据后文本框显隐异常修复方案

问题根因 #

现有代码仅绑定了复选框的点击事件，只有用户手动点击复选框时才会触发文本框的显隐逻辑。表单重载并从数据库赋值完成后，页面加载阶段没有主动读取复选框的初始状态来控制文本框显隐，因此会出现复选框已勾选但文本框仍隐藏的问题。

修复代码 #

直接替换原有脚本即可，不需要修改视图代码：

<script>
    $(function () {
        // 抽离显隐逻辑为公共函数，供初始化和事件触发共用
        function toggleTextBox() {
            const isChecked = $("#check2").is(":checked");
            $("#text2,#coba").toggle(isChecked);
        }
        
        // 页面加载完成先执行一次，适配数据库绑定的初始值
        toggleTextBox();
        // 绑定状态变化事件，用户操作时触发，用change比click兼容性更好，支持键盘操作等场景
        $("#check2").change(toggleTextBox);
    });
</script>

如果你更习惯原来的if-else写法，保留原来的判断逻辑也可以，核心是要增加初始化执行的步骤。

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