jQuery处理含confirm的提交按钮：点击检测异常问题求助

问题根源 #

你的代码出现这些问题的原因很明确：

• 第一次点击无反应：按钮自带的onclick事件会优先于jQuery绑定的点击事件执行，第一次点击时你还没完成window.confirm的重写，自定义逻辑根本没触发。
• 后续多次触发：每次点击按钮都会重新定义一次window.confirm，相当于给这个函数套了多层“壳”，后续点击会依次执行所有之前定义的逻辑。
• 返回false仍继续执行：你提前用e.preventDefault()阻止了默认提交，但原onclick的返回值已经独立执行，重写confirm的操作滞后，无法影响原逻辑的走向。

解决方案（推荐方案：完全接管逻辑） #

直接移除按钮自带的onclick属性，用jQuery统一处理点击和确认逻辑，这样不会有事件顺序冲突，逻辑也更清晰：

1. 修改HTML（移除onclick）

<input type="submit" name="submit" value="Remove" class="remove">

2. 简化JS代码

$("body").on('click', '.remove', function(e) {
    // 先阻止表单默认提交行为
    e.preventDefault();
    
    // 直接调用原生confirm
    var isConfirmed = window.confirm("Are you sure you want to remove this?");
    console.log(isConfirmed);
    
    if (!isConfirmed) {
        console.log("user pressed cancel: Some cleanup");
        return; // 终止后续操作
    }
    
    // 用户点击确定时执行后续任务
    console.log("user pressed ok: Do tasks");
    // 如果需要提交表单，手动触发即可
    // $(this).closest('form').submit();
});

备选方案（保留原onclick） #

如果不想修改HTML，可以在页面加载完成后直接重写window.confirm，而不是在点击事件里重复定义：

$(function() {
    var originalConfirm = window.confirm;
    
    window.confirm = function(msg) {
        var result = originalConfirm(msg);
        console.log(result);
        
        if (!result) {
            console.log("user pressed cancel: Some cleanup");
        } else {
            console.log("user pressed ok: Do tasks");
        }
        
        // 必须返回结果，保证原onclick的返回值能正常阻止提交
        return result;
    };
});

这种方式下，原按钮的onclick="return window.confirm(...)"会自动调用重写后的函数，返回false时会阻止表单提交，不需要额外绑定点击事件。

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