使用 <a> 使用 jquery 双重确认 SweetAlert

Question

我想删除一个账号的时候要进行双重确认，我真的很纠结。我在论坛上查看过，但似乎没有什么比我的问题更好的了。我正在使用 Symfony

我的 UserAccountController 上的 deleteAccount 函数：

/**
 * @Route("user/account/delete", name="user_delete")
 */
public function deleteAccount(): Response{

    $user = $this->getUser();

    $this->container->get('security.token_storage')->setToken(null);

    $entityManager = $this->getDoctrine()->getManager();
    $entityManager->remove($user);
    $entityManager->flush();

    $this->addFlash(
        'success',
        'Account Deleted successfully'
    );
    
    return $this->redirectToRoute('homepage');
}

我的 link 观点：

<a href="{{ path('user_delete') }}" class="btn btn-danger deleteButton">Delete Account</a>

还有我的 jquery :

$('.deleteButton').on('click', function() {

event.preventDefault();

Swal.fire({
    title: 'Are you sure?',
    text: "You won't be able to revert this!",
    icon: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'Yes, delete it!'
}).then((result) => {
    
    if (result.isConfirmed) {

        setTimeout( function () { 
            $.get($(this).attr('href'),{});
        }, 1200);

        Swal.fire(
            'Deleted!',
            '',
            'success'
        )

    }

})

});

Answer 1

您必须将删除 url 存储在变量中，因为 'this' 不再引用按钮

 $('.deleteButton').on('click', function() {
     
    event.preventDefault();
    const deleteUrl = $(this).attr('href');
    
    Swal.fire({
        title: 'Are you sure?',
        text: "You won't be able to revert this!",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
        
        if (result.isConfirmed) {
    
            setTimeout( function () { 
                $.get(deleteUrl,{});
            }, 1200);
    
            Swal.fire(
                'Deleted!',
                '',
                'success'
            )
    
        }
    
    })

或者这样做，

setTimeout( function () { 
                    $.get('{{ path('user_delete') }}',{});
                }, 1200);

使用 <a> 使用 jquery 双重确认 SweetAlert

Double confirmation SweetAlert with jquery using <a>

javascript

html

jquery

symfony

sweetalert