jquery重定向和ajax执行顺序答案

【问题标题】：Jquery redirect and ajax execution sequencejquery重定向和ajax执行顺序
【发布时间】：2016-08-15 22:22:26
【问题描述】：

我在表单提交上有一个函数，它执行除 ajax 请求之外的所有内容。我在发送数据之前做了一些检查，但是在我检查复选框的选中状态的部分，我有一个问题，当它是真的时，它会重定向到我指定的 URL，并且 ajax success never什么都不做，实际上数据永远不会发送到 Ajax URL。选中后，数据将发送到Ajax方法中指定的URL（我的Ajax函数是save_sell）。

如果我将重定向代码放在 Ajax 中，重定向永远不会发生。

$('#my_form').on('submit', function(event){
            event.preventDefault();
            if ($('#select1').val()===''){
              alert('Message 1');
            }
            else if ($('#select2').val()===''){
              alert('Message2');
            }
            else if ($('#select3').val()===''){
              alert('Message3');
            }
            else if ($('#select4').val()===''){
              alert('Message4');
            }
            else if ($('#numperinput1').val()==='0.00' || $('#numberinput1').val()==='' ){
              alert('Message5');
            }
            else if ($('#select5').val()===''){
              alert('Message6');
            }
            else {
              console.log("form submitted!")  // sanity check
              var tbl = $('table#My_table tr').get().map(function(row) {
                return $(row).find('td').get().map(function(cell) {
                  return $(cell).html();
                });
              });
              $.each(tbl, function(key,value) {
                value.pop();
              });
              tbl.shift();
              var tblJson=JSON.stringify(tbl);
              save_sell(tblJson);
              console.log("saving");

              if ($('#checkbox1').is(':checked')) { //here is the problem
                $(location).attr('href', '/the_url?number=5');
                console.log("downloading");
              }
              console.log("after download");
            }
        });

编辑：这是我的 ajax 函数

        function save_sell(table_array) {
            $.ajax({
                url : "/Store/Sell/", 
                type : "POST",
                data : { table: table_array},
                success : function(json) {
                  console.log('Success!');
                  var res_sell=json.idsell;
                  console.log('Sell:'+res_idsell);
                  $("#sell_result").text(res_idsell);
                },

                error : function(xhr,errmsg,err) {
                    $('#results').html("<div class='alert-box alert radius' data-alert>Oops! Error: "+errmsg+
                        " <a href='#' class='close'>&times;</a></div>");
                    console.log(xhr.status + ": " + xhr.responseText);
                }
            });
        };

有没有办法通过 ajax 发送数据并等待 ajax 响应后再进行重定向？

编辑：我试图添加这个，只是写在脚本上：

    $( document ).ajaxComplete(function( event, xhr, settings ) { 
      if ( settings.url === "/Store/Sell/" ) { 
        console.log("Ajax complete");
        if ($('#checkbox1').is(':checked')) {
          console.log("Checked");
          $(location).attr('href', '/the_url?number=5');
        }
      }
    });

我可以在控制台中看到“Ajax complete”，但控制台中从来没有写过“Checked”。

我还尝试将其附加到我的 ajax 末尾：

            function save_sell(table_array) {
                $.ajax({
                       //all the ajax thing that I posted before
                }).done(function( data ) {
                        console.log("Ajax complete");
                        if ($('#checkbox1').is(':checked')) {
                               console.log("Checked");
                        $(location).attr('href', '/the_url?number=5');
                        }
                });
           };

并且得到了相同的结果，我可以在控制台中看到“Ajax 完成”，但控制台中从来没有写过“已检查”。

【问题讨论】：

试过AJAX中的complete()函数？
@Scott 实际上不，我要编辑我的问题并发布我的 ajax 函数，这样你就可以知道我必须把它放在哪里：D

标签： jquery ajax redirect

【解决方案1】：

以下对话： How to check whether a checkbox is checked in jQuery?

您应该使用$('#checkbox1').checked 来测试复选框的值。

ajax调用流程如下：

beforeAjax();
$.ajax(...).done(function(){
     afterReceivingWithSuccess();
 }).complete(function(){
     afterReceiving();
 });
 afterSendingAjaxCall();

【讨论】：

【解决方案2】：

当您在该重定向页面之后使用 AJAX 时，Ajay 在异步下运行并且不会停止进一步执行。所以防止并等待 AJAX 你必须在 ajax 参数中传递 async: false 你必须从 AJAX 成功回调函数重定向

【讨论】：

【解决方案3】：

现在正在使用 ajax 方法中附加的“完成”，这是我的错误，在提交结束时我有这个代码：

$('#my_form').find(':checkbox').prop('checked', false);

由于该代码 checkbox1 始终为 false，我将代码更改为：

$('#my_form').find(':checkbox').not('#checkbox1').prop('checked', false);

并在ajax方法的“done”中输入“if”后将其更改为false。

【讨论】：