javascript - Sweet Alert 2 提交前确认

Question

我试图在提交表单之前弹出确认信息。但这不起作用。我正在使用 Sweet Alert 2。

document.querySelector('#order').addEventListener('submit', function(e) {
        var form = $(this).parents('form');
        e.preventDefault();
        swal({
            title: "Are you sure?",
            text: "Once a invoice is created, you will not be able to delete without the help of support",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: '#DD6B55',
            confirmButtonText: 'Yes, I am sure!',
            cancelButtonText: "No, cancel it!",
        }).then(function() {
            swal({
                title: 'Success!', 
                text: 'Invoice created! Go to the invoice tab to pay it.', 
                type: 'success'
            }, function() {
                form.submit();
            });
        },function(dismiss) {
            if(dismiss == 'cancel') {
                swal("Cancelled", "Invoice not created!", "error");
            }
        });
    });

这是我的 Javascript 代码，我的 PHP 代码看起来像这样

 <?php
if(isset($_POST['k'])
{
header('Location: https://google.com');
}
?>

我的 HTML 代码是

<form method="POST">
<button type="submit" name="k"></button
</form>

为什么不起作用？

<小时/>

更新

$("#order").on('submit', function(e) {
        var form = $(this);
        e.preventDefault();
        swal({
            title: "Are you sure?",
            text: "Once a invoice is created, you will not be able to delete without the help of support",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: '#DD6B55',
            confirmButtonText: 'Yes, I am sure!',
            cancelButtonText: "No, cancel it!",
        }).then(function() {
            swal({
                title: 'Success!', 
                text: 'Invoice created! Go to the invoice tab to pay it.', 
                type: 'success'
            }, function() {
                $(this).trigger('submit');
            });
        },function(dismiss) {
            if(dismiss == 'cancel') {
                swal("Cancelled", "Invoice not created!", "error");
            }
        });
    });

此外，我忘记补充一点，我解析了该代码，并且在我的实际代码上是表单上的 ID

不工作是指数据没有被发布。如果工作正常，它应该根据 PHP 代码重定向到 google.com

Answer 1

我不是编码员，但我发现将提交放在 .then(function() { 下对我来说是一个可行的解决方案。我使用的代码是 lp.jQuery("div.main-form form").submit( )；但您的表单名称会有所不同。我希望它能以某种方式有所帮助。

$("#order").on('submit', function(e) {
    var form = $(this);
    e.preventDefault();
    swal({
        title: "Are you sure?",
        text: "Once a invoice is created, you will not be able to delete without the help of support",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: '#DD6B55',
        confirmButtonText: 'Yes, I am sure!',
        cancelButtonText: "No, cancel it!",
    }).then(function() {
      $(this).trigger('submit');
        swal({
            title: 'Success!', 
            text: 'Invoice created! Go to the invoice tab to pay it.', 
            type: 'success'
        }, function() {
            $(this).trigger('submit');
        });
    },function(dismiss) {
        if(dismiss == 'cancel') {
            swal("Cancelled", "Invoice not created!", "error");
        }
    });
});