如何向通过 Jquery 进行的删除操作添加确认？答案

【问题标题】：How can I add a confirmation to a delete action made through Jquery?如何向通过 Jquery 进行的删除操作添加确认？
【发布时间】：2019-10-22 10:04:12
【问题描述】：

我在 JQuery 中有一个函数，它结合 PHP 和 SQL 从表中删除行，从数据库中删除它们。

当我单击删除按钮时，行会立即被删除，但是，我想添加另一个确认级别，询问您是否真的要删除它。

通过引用函数删除行的部分

$userObj  = mysqli_query($conn , 'SELECT * FROM `shifts`');

if(isset($_POST['data'])){
    $dataArr = $_POST['data'] ;

    foreach($dataArr as $id){
        mysqli_query($conn , "DELETE FROM shifts where id='$id'");
    }
    echo 'record deleted successfully';
}

jQuery 函数

<script>

    $(document).ready(function(){
        $('#checkAll').click(function(){
            if(this.checked){
                $('.checkbox').each(function(){
                    this.checked = true;
                });
            }else{
                $('.checkbox').each(function(){
                    this.checked = false;
                });
            }
        });


        $('#delete').click(function(){
            var dataArr  = new Array();
            if($('input:checkbox:checked').length > 0){
                $('input:checkbox:checked').each(function(){
                    dataArr.push($(this).attr('id'));
                    $(this).closest('tr').remove();
                });
                sendResponse(dataArr)
            }else{
                alert('No record selected ');
            }

        });


        function sendResponse(dataArr){
            $.ajax({
                type    : 'post',
                url     : 'includes/dbh.inc.php',
                data    : {'data' : dataArr},
                success : function(response){
                    alert(response);
                },
                error   : function(errResponse){
                    alert(errResponse);
                }
            });
        }

    });
</script>

【问题讨论】：

如果您也包含相关的 HTML 代码会有所帮助（#delete 按钮）

标签： php jquery sql

【解决方案1】：

Javascript 有一个确认函数，它会根据用户选择的是或否返回一个布尔值。您可以使用它来让用户确认他们想要删除您的 click 函数中的记录。

$('#delete').click(function(){
         if (confirm("Are you sure you want to delete this?")) {
            var dataArr  = new Array();
            if($('input:checkbox:checked').length > 0){
                $('input:checkbox:checked').each(function(){
                    dataArr.push($(this).attr('id'));
                    $(this).closest('tr').remove();
                });
                sendResponse(dataArr)
            }else{
                alert('No record selected ');
            }
         } 
});

【讨论】：