Wordpress一键发送多个AJAX请求

时间:2015-11-11 09:29:24

标签: php jquery ajax wordpress

我保存帖子的ajax功能正在发出多个请求,我无法理解原因。我尝试搜索可能导致双击的重复元素,但没有重复。有时它会在一次点击中发布4次

当我点击#order_save按钮

时,这是多个ajax帖子的屏幕截图

enter image description here

我的#order_save按钮,当我在DOM树中搜索order_save时,第一个匹配就是这个元素。 (原始点击元素)

enter image description here

order_save的第二个匹配(2个中的2个)是jquery代码(这是正常的)

jQuery(function($) {
     $(document).on('click','#order_save',function(){
        var order_title = $('#client-order-title').val();
        var order_comment = $('#client-comment').val();
        var order_date = $('#order_date_till').val();
        var price_input = $('#order_price').val();
        var order_price;
        var order_attachments = [];
        if($('#order_price_on_deal:checked').val() == 'foo') {
            order_price = 'foo';
        }else{
            order_price = price_input;
        }
        if(!order_title) {
            $('#client-order-title').addClass('has-error');
            return false;
        }else{
            $('#client-order-title').removeClass('has-error');
        }
        if(!order_comment) {
            $('#client-comment').addClass('has-error');
            return false;
        }else{
            $('#client-comment').removeClass('has-error');
        }
        $('#files_public .order-attachment').each(function() {
                var attachment_link = $(this).find('a').attr('href');
                var attachment_title = $(this).text();
                order_attachments.push({
                'file_url' : attachment_link,
                'file_name' : attachment_title
                });
        });                     

            $.ajax({ // Line 68 is here
                url: my_ajax.url,
                type: "POST",
                data: {
                    'action' : 'xx_order_saving',
                    'order_title' : order_title,
                    'order_comment' : order_comment,
                    'order_date' : order_date,
                    'order_price' : order_price,
                    'order_attachment' : order_attachments,
                    'order_type' : 'public_order'
                },
                dataType: "json",
                success: function(response){
                    if(response.html) {
                        $('#currentOrder').html(response.html);
                    }
                }
            })              

    });
});

我的函数php中的PHP处理程序(工作正常)

function xx_order_saving() {
 // posting data here
 if($order_title && $order_comment) {
  $new_post_a = array(
      'post_type' => 'orders',
      'post_title' => $order_title,
      'post_status' => 'publish'
  );
  $new_order = wp_insert_post($new_post_a);
  if($new_order) {
    wp_update_post( array( 'ID' => $new_order, 'post_name' => $new_order ) );
  } 
  $template_file = 'xxx-order-saved.php';
  ob_start();
  include(locate_template($template_file,false,false));
  $page_template = ob_get_contents();
  ob_end_clean();
  $response['html'] = $page_template;
  wp_send_json($response);
 }
}
add_action('wp_ajax_xx_order_saving','xx_order_saving');
add_action('wp_ajax_nopriv_xx_order_saving','xx_order_saving');

使用此函数

动态加载上面带有jquery代码的模板文件
function load_frame() {
$option = $_POST['option'];
if($option){
    $template_file = 'xxxx-'.$option.'.php';
    ob_start();
    include(locate_template($template_file,false,false));
    $page_template = ob_get_contents();
    ob_end_clean();
    $response['html'] = $page_template;
    wp_send_json($response);            
  }
}

有时它工作正常,发送一个请求,保存一个帖子,有时它发布4或2次,如上面的屏幕截图所示。

以下是导致问题的原因:

如果有order-attachments,例如一个附件,它将发送两个请求(保存两个帖子)如果有两个附件它将发送一个请求,如果有三个附件它将发送4个请求,如果有是5它再次发送一个。我只是没有得到它。任何帮助将不胜感激

<div id="files_public" class="form-group">
<span class="list-group-item order-attachment">Image.png
<a href="//Image.png">...</a></span>
</div>

1 个答案:

答案 0 :(得分:1)

更改

$(document).on("click", "#order_save", function () {

$("#order_save").click(function () {