JQuery实现删除操作确认弹窗功能

// 确认删除操作的弹窗函数
function confirmDelete(event, url) {
    // 阻止默认行为
    event.preventDefault();
 
    // 使用Bootstrap的模态框显示确认信息
    $('#confirmDeleteModal').modal('show');
 
    // 设置确认按钮的点击事件
    $('#confirmDeleteBtn').unbind().click(function() {
        $.ajax({
            url: url, // 删除请求的URL
            type: 'DELETE', // 请求类型
            success: function(result) {
                // 请求成功后的回调函数
                $('#confirmDeleteModal').modal('hide');
                alert('删除成功！');
                // 刷新页面或执行其他操作
                location.reload();
            },
            error: function(error) {
                // 请求失败后的回调函数
                alert('删除失败，请重试！');
            }
        });
    });
}
 
// 使用方法：
// 1. 在HTML中定义一个删除链接，并添加自定义属性data-url指向删除的API地址。
// 2. 在页面加载时绑定点击事件到删除链接。
// 示例HTML:
// <a href="#" data-url="/api/delete/123" onclick="confirmDelete(event, this.getAttribute('data-url'));">删除</a>

这段代码定义了一个confirmDelete函数，它会在用户点击删除链接时触发，并通过Ajax请求确认删除操作。它使用了Bootstrap的模态框来提示用户进行确认，并在用户确认后发送DELETE请求。成功删除后，它会隐藏模态框，并提示删除成功。如果删除失败，它会提示删除失败，并允许用户重试。