Question

I have the code

<a href="<?php echo site_url('company/remove_company/'.$value['id']).'/'.$value['company_name']; ?>" title="Remove Data"><i class="icon-trash"></i></a>

and I have another code written in jquery and using sweetalert function which will popup a warning message if the user are trying to delete record in the database.

$(".icon-trash").click(function(){
    swal({
      title: "Are you sure?",
      text: "You will not be able to recover this imaginary file!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete it!",
      closeOnConfirm: false }, function() {
        swal("Deleted!", "Your imaginary file has been deleted.", "success");
      });
  });

the problem of my code is, when the user click on the link, it will popup very fast, and go to the link given in href attribute. I would like to prevent it from going to the link, allowing the popup to stay display until the user decide whether to click the yes delete it or cancel and will not go to the link if the user click the cancel.

Any Help? I don't know what to do about it.

Answer 1

您需要阻止默认操作，并在成功后继续进行位置更改：

$(".icon-trash").click(function(e) {
    var that = this;
    // Prevent the default action.                                      « Look here.
    e.preventDefault();
    swal({
      title: "Are you sure?",
      text: "You will not be able to recover this imaginary file!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete it!",
      closeOnConfirm: false }, function() {
        swal("Deleted!", "Your imaginary file has been deleted.", "success");
        // In this confirm, add the location.                           « Look here.
        location.href = $(that).attr("href");
      });
  });

此外，最好不要使用任何类型的数据库写入函数，如：

创建新条目。
删除条目。

在GET方法中。有危险。所以你应该考虑通过提供POST方法来改变它并通过JavaScript / AJAX执行它。

Answer 2

你也可以通过以下方式实现这一目标：

链接：

<a href="<?php echo site_url('company/remove_company/'. $value->id); ?>" class="delete-company">

剧本：

    $('.delete-company').on('click', function(e) {
    var that = $(this);
    swal({   
      title: "Are you sure?",   
      text: "You will not be able to recover this user account!",   
      type: "warning",   
      showCancelButton: true,   
      confirmButtonColor: "#DD6B55",   
      confirmButtonText: "Yes, delete it!",   
      cancelButtonText: "No, cancel please!",   
      closeOnConfirm: false,   
      closeOnCancel: false 
    }, 
    function(isConfirm){   
      if (isConfirm) { 
       location.replace(that.attr('href'));
       swal("Success","User successfully removed!", "success");
    } else {     
      swal("Cancelled", "Removing user accout was cancelled!", "error");   
    }
   });
    e.preventDefault();
  });

如何暂停<a> tag?

2 个答案: