javascript - JQuery swal 确认不提交

Question

我正在尝试使用sweet alert创建确认。当用户单击按钮时，swal (警报)窗口打开，他们可以确认或取消。如果confirm单击，然后 JQuery应该点击它。

但它没有做任何事情。你知道问题出在哪里吗？

我尝试了多种选项 - unbind.click()等等..

$('.button-apply').on('click', function (e) {
        var t = $(this);
        e.preventDefault();
        swal({
            title: "Are you sure?",
            text: "Do you want to apply for this job?",
            type: "info",
            showCancelButton: true,
            confirmButtonColor: "#b3ff99",
            confirmButtonText: "Confirm",
            //closeOnConfirm: false,
            //showLoaderOnConfirm: true,
            html: false
        }, function (isConfirm) {
            if (!isConfirm) {
                return;
            } else {
                t.click();
            }
        })

    })

编辑: 已更改} else { t.click(); }

到

} else {
                t.unbind('click');
                t.trigger('click');
            }

成功解除绑定(bind)，但是t.trigger('click')不执行。

已解决:

因为它是 <a href....> ，我做不到t.submit()当它解除绑定(bind)时，我替换了 t.click()与 window.location.href = t.attr('href');并且它工作正常。

Answer 1

您已指定e.preventDefault();这将阻止 button-apply 上的事件触发。删除这一行，点击事件就会回来。

作为附加说明，当用户按下“取消”时，您会再次触发相同的事件，这将导致无限循环。您应该删除 t.click(); 并放置您想要在用户执行此操作时调用的逻辑。

举个例子:

$('.button-apply').on('click', function (e) {
        var t = $(this);
        swal({
            title: "Are you sure?",
            text: "Do you want to apply for this job?",
            type: "info",
            showCancelButton: true,
            confirmButtonColor: "#b3ff99",
            confirmButtonText: "Confirm",
            //closeOnConfirm: false,
            //showLoaderOnConfirm: true,
            html: false
        }, function (isConfirm) {
            if (!isConfirm) {
                alert('You have not applied for the job!');
            } else {
                alert('You have applied for the job');
                // Submit form $("#yourForm").submit();
                // or an AJAX call.
            }
        })

    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>


<button class="button-apply">Click me</button>