按订单运行ajax请求

时间:2017-10-19 13:07:07

标签: php ajax wordpress

如何按顺序在for循环中发送ajax?这是我的代码:

function ajax_sent(i, btn){
    jQuery.ajax({
       url  : ln_ajax_handle.ajax_url,
       type : 'post',
       data : {
            action    : 'ln_ajax_handle',
            main_data : i
        },
        success : function(result){
            jQuery('#ln-modal-bangchinh').append(result);
            if(i === 5){
                btn.button('reset');
                jQuery('#ln-content-modal').modal('show');
            }
        }
   });
}

jQuery(document).ready(function(){
    jQuery('.ln-update').click(function(){
        var btn = jQuery(this);
        btn.button('loading');

        for(var i = 1; i <= 5; ++i){
            ajax_sent(i, btn);
        }
    });
});

这里是简单的php测试功能:

function ln_ajax_handle(){
    $data = $_POST['main_data'];

    echo ln_alert_test($data);

    wp_die();
}

function ln_alert_test($data){
    ob_start();
    ?>
    <div class="alert">
      <button type="button" class="close" data-dismiss="alert">&times;</button>
      <strong>Success!</strong> The loop run by <?php echo $data; ?> times;
    </div>
    <?php    return ob_get_clean();
}

在php文件中,我使用echo进行简单测试。但结果是数字不是按顺序排序,就像图像一样。 enter image description here。我希望在i = 1时,我收到服务器的响应,i = 2将会执行。而下一步的进展是一样的。有什么办法吗?

1 个答案:

答案 0 :(得分:4)

您需要以上述完成之后每隔一个请求开始的方式链接ajax请求。

var i = 1,
  fn = function() {
    i <= 5 && ajax_sent(++i, btn, fn);
  };

ajax_sent(i, btn, fn);

 // add a callback cb to be called on success
function ajax_sent(i, btn, cb) {
  jQuery.ajax({
    url: ln_ajax_handle.ajax_url,
    type: 'post',
    data: {
      action: 'ln_ajax_handle',
      main_data: i
    },
    success: function(result) {
      // if a callback was provided call it
      cb && cb();
      jQuery('#ln-modal-bangchinh').append(result);
      if (i === 5) {
        btn.button('reset');
        jQuery('#ln-content-modal').modal('show');
      }
    }
  });
}