Sweetalert AJAX 失败

Question

我尝试在我的代码中实现 SweetAlert2，我尝试从触发按钮调用函数失败。

知道如何修复此代码以使其正常工作吗？

    $(".delete").click(function () {

                    swal({

                        title: 'Are you sure?',
                        text: "You won't be able to revert this!",
                        type: 'warning',
                        showCancelButton: true,
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: 'Yes, delete it!'
                    }).then(function () {
                 delete_post($(this).attr("id"));

                        swal(
                            'Deleted!',
                            'Your file has been deleted.',
                            'success'
                        )


                })

            })
        });

调用函数：

  function delete_post(id) { 
            var info = {"delete_post_id":id};
            $.post('index.php',
                info
            ).done(function( response )  {
                if(response["error"]) {
                    $('#error').html(response["error"]);
                }else{
                    window.location = "index.php";
                }
            });
        }

Answer 1

在此行之前输入 console.info(this);：

delete_post($(this).attr("id"));

我认为 this 是你的功能。

Answer 2

正如@Halil 所说，这是因为在您的警报回调中 this，this 在回调中不是指您的按钮，而是指回调函数本身。

在显示警报之前将 id 分配给变量，以便您可以在回调中使用它，如下所示：

$(".delete").click(function() {

  console.log('Delete button has been clicked...');

  // get the id
  var id = $(this).attr("id"));

  swal({
    title: 'Are you sure?',
    text: "You won't be able to revert this!",
    type: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'Yes, delete it!'
  }).then(function() {

    console.log('Confirm button clicked...');

    // use the id we declared earlier
    delete_post(id);

    swal(
      'Deleted!',
      'Your file has been deleted.',
      'success'
    );

  });

});

function delete_post(id) {

  console.log('Deleting post...', id);

  var info = {
    "delete_post_id": id
  };

  $.post('index.php', info)
    .done(function(response) {

      console.log('Completed request...', response);

      if (response["error"]) {

        $('#error').html(response["error"]);

      } else {

        window.location = "index.php";

      }

    });
}

我还添加了一些 console.log 调试，这样您就可以在浏览器中运行看到发生了什么。

Sweetalert AJAX 失败

Sweetalert AJAX fails

javascript

ajax

jquery

sweetalert