关闭Modal后页面无法滚动问题求助（附关联代码）

Hey，我碰到过类似的Bootstrap Modal滚动锁死问题，看了你的代码，问题应该出在手动处理modal backdrop的方式上，和Bootstrap的默认行为冲突了。

问题成因分析 #

Bootstrap的Modal组件有一套完整的开闭逻辑：

• 打开Modal时，会自动给<body>添加modal-open类，禁用页面滚动；同时生成并插入.modal-backdrop遮罩层。
• 调用modal('hide')关闭Modal时，组件会自动执行：移除.modal-backdrop、从<body>上删掉modal-open类，恢复页面滚动。

你手动执行了$('.modal-backdrop').remove()，这会干扰Bootstrap的内部关闭流程，导致modal-open类没能被正常移除——这就是页面无法滚动的核心原因。另外，你在Modal还没完全关闭时就触发标签页点击，也可能加剧这个问题。

修复方案 #

只需要调整两处代码，让Bootstrap自己处理Modal的关闭流程：

1. 删掉手动移除backdrop的代码
2. 把标签页切换的逻辑放到Modal完全关闭的回调事件里，确保流程顺序正确

修改后的代码如下：

$(document).off('click','.updatecat'); 
$(document).on('click','.updatecat',function(){ 
    $('#cat-update').ajaxSubmit({ 
        dataType:'json', 
        success:function(response){ 
            if(response.type == 'success'){ 
                // 仅调用Modal隐藏方法，交给Bootstrap处理后续逻辑
                $('#catupdate').modal('hide'); 
                // 监听Modal完全关闭的事件，再执行标签页切换（用one避免重复绑定）
                $('#catupdate').one('hidden.bs.modal', function () {
                    $('#taba4').trigger('click');
                    alert("Category Updated"); 
                });
            }else{ 
                alert(response.message); 
            }
            console.log(response); 
        } 
    }); 
}); 

额外检查点 #

如果修改后还是有问题，可以打开浏览器开发者工具，查看<body>标签上是否还残留modal-open类：

• 如果有，手动执行$('body').removeClass('modal-open')就能临时恢复滚动，说明还有其他地方干扰了Bootstrap的流程。
• 另外，确保你的Bootstrap版本没有bug，尽量使用稳定版的组件。

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