javascript - jQuery - 防止通过 ajax 后验证提交内部 promise

Question

我们试图在从帖子返回验证后停止表单提交。该调用在一个 promise 内，并在一个确认对话框之后。

几个小时后我心碎了，我无法让它工作。

var $form = $('#frmBoleto');

$form.submit(function(e){
    var modo = $('input[name="modo"]:checked').val();

    if (modo == 'naoimprime'){
        // Send post
        $.when( $.post($form.attr('action') + '?verifica', $form.serialize())).then(function( d ){
            if (d && d.exists){
                var answer = window.confirm('You sure?');

                if (!answer){
                    e.preventDefault();
                    e.stopImmediatePropagation();
                    e.stopPropagation();
                }
            }
        });
    }
});

表单总是提交，为什么？

Answer 1

$post().then(...) 回调在稍后的事件线程中触发，因此来不及阻止表单提交。

您需要在 .submit() 处理程序中无条件地禁止提交表单，并在 .then() 回调中强制有条件地提交。

var $form = $('#frmBoleto');

$form.submit(function(evt) {
    evt.preventDefault();
    if ($('input[name="modo"]:checked').val() == 'naoimprime') {
        $.post($form.attr('action') + '?verifica', $form.serialize()).then(function(d) {
            if (d && d.exists && window.confirm('You sure?')) {
                $form.get(0).submit();
            }
        });
    }
});