解决Bootstrap Modal在AJAX提交后无法完全关闭的问题

$('#submit').click(function(){
    $("#form").submit(function(e){
        e.preventDefault();
        // ... AJAX 逻辑 ...
        $('#regModal').modal('hide');
    });
});

$(document).ready(function(){
    $("#form").submit(function(e){
        e.preventDefault(); // 阻止表单默认提交行为
        // ... AJAX 逻辑 ...
    });
});

$(document).ready(function(){
    // 页面加载时执行的初始化函数
    loadNewCourse();
    loadDelTable();

    // 为表单的提交事件绑定处理函数，确保只绑定一次
    $("#form").submit(function(e){
        e.preventDefault(); // 阻止表单的默认提交行为

        // 发送AJAX请求
        $.ajax({
            url: 'cos_reg.php', // 后端处理表单数据的URL
            type: 'POST',
            cache: false,
            // 建议移除 async: false，使用异步请求以避免阻塞UI
            data: $(this).serialize(), // 序列化表单数据
            success: function(data){
                // AJAX请求成功后的处理
                loadNewCourse(); // 更新页面内容
                loadDelTable();  // 更新页面内容

                // 成功后隐藏模态框，确保只调用一次
                $('#regModal').modal('hide');

                // 显示成功提示
                swal({
                    position: "top-end",
                    type: "success",
                    title: "Registration successful",
                    showConfirmButton: false,
                    timer: 2000
                });
            },
            error: function(jqXHR, textStatus, errorThrown){
                // AJAX请求失败后的处理
                console.error("AJAX Error: ", textStatus, errorThrown);
                swal("Oops...", "Registration failed.", "error");
            }
        });
    });

    // 辅助函数：加载新课程列表
    function loadNewCourse(){
        $.ajax({
            url: 'processReg.php',
            type: 'POST',
            cache: false,
            // async: false, // 同样建议移除
            data: { loadit: 1 },
            success: function(disp){
                $("#reveal").html(disp).show();
            },
            error: function(jqXHR, textStatus, errorThrown){
                console.error("Error loading new courses: ", textStatus, errorThrown);
            }
        });
    }

    // 辅助函数：加载删除表格
    function loadDelTable(){
        $.ajax({
            url: 'delete_tbl.php',
            type: 'POST',
            cache: false,
            // async: false, // 同样建议移除
            data: { loadDel: 1 },
            success: function(deldisp){
                $("#showRegtbl").html(deldisp).show();
            },
            error: function(jqXHR, textStatus, errorThrown){
                console.error("Error loading delete table: ", textStatus, errorThrown);
            }
        });
    }

    // 如果模态框在页面加载时需要隐藏（例如，防止意外显示）
    // $('#regModal').modal('hide'); // 可以在这里调用，但通常通过HTML的 'fade' 类和默认状态控制

    // 如果有特定的按钮用于打开模态框，可以这样绑定
    // 例如：<button id="showModalButton">打开模态框</button>
    // $('#showModalButton').click(function() {
    //     $('#regModal').modal('show');
    // });
});

<div class="modal fade" id="regModal" role="dialog" aria-hidden="true" tabindex="-1" style="z-index:10000;">
   <div class="modal-dialog modal-md">
    <div class="modal-content">
        <div class="modal-header">
            <h5 style="margin-bottom:0;text-align:center;">Course Registration</h5>
            <!-- 确保关闭按钮的data-dismiss属性正确 -->
            <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
            <!-- 对于Bootstrap 5，应为 data-bs-dismiss="modal" -->
        </div>
        <div class="modal-body">
            <form id="form" method="POST" action="#">
                <!-- 表单内容 -->
                <div style="width:100%;margin:0;margin-top:10px;text-align:right;">
                    <button class="btn btn-md btn-primary" id="submit" type="submit" name="submit" style="width:100%;">Register</button>
                </div>
            </form>
        </div>
        <div class="modal-footer" style="text-align:left;">
            <!-- 确保关闭按钮的data-dismiss属性正确 -->
            <button type="button" class="btn btn-default" id="close" style="float:left;background:lightgrey;color:#000;" data-dismiss="modal" aria-label="Close">Close</button>
            <!-- 对于Bootstrap 5，应为 data-bs-dismiss="modal" -->
        </div>
    </div>
</div>