添加“加载”动画jQuery的功能按钮，点击之后

Question

我需要添加“加载”动画按钮后，jQuery函数单击

所以，我有一个功能：

function get_revpopup_cart(product_id, action, quantity) { 
    quantity = typeof(quantity) != 'undefined' ? quantity : 1; 
    if (action == "catalog") { 
     $.ajax({ 
      url: 'index.php?route=checkout/cart/add', 
      type: 'post', 
      data: 'product_id=' + product_id + '&quantity=' + quantity, 
      dataType: 'json', 

     beforeSend: function(){ 
      $('body').addClass('blur2'); 
      $('#pagefader2').fadeIn(70); 
     }, 
    ............. 

和这部动画： <div class="page_gif_progress_icon"><div class="circle"></div></div>

钮：<a onclick="get_revpopup_cart('103', 'catalog', '1');" data-toggle="tooltip" title="В корзину"><i class="fa fa-border fa-shopping-basket"><span class="prlistb">add in cart</span></i>

我需要添加“加载”动画before $('body').addClass('blur2');将OPE ñ并作为函数执行

感谢

Answer 1

我很抱歉，但您的解决方案并没有为我工作。 我解决了这个问题是这样的：

function get_revpopup_cart(product_id, action, quantity) { 
    quantity = typeof(quantity) != 'undefined' ? quantity : 1; 
    if (action == "catalog") { 
     $.ajax({ 
      url: 'index.php?route=checkout/cart/add', 
      type: 'post', 
      data: 'product_id=' + product_id + '&quantity=' + quantity, 
      dataType: 'json', 

     beforeSend: function(){ 

      $('body').append('<div class="page_gif_progress_icon"><div class="circle"></div></div>').addClass('blur2'); 
      $('#pagefader2').fadeIn(70); 
     }, 

并添加此$(".page_gif_progress_icon").remove();

Answer 2

不知道这是你需要的东西后消失：

function get_revpopup_cart(product_id, action, quantity) { 
    //create reference to your loading animation node 
    var preloader = $('<div>') 
        .addClass('page_gif_progress_icon'). 
        .append($('<div>').addClass('circle')); 
    quantity = typeof(quantity) != 'undefined' ? quantity : 1; 
    if (action == "catalog") { 
    $.ajax({ 
     url: 'index.php?route=checkout/cart/add', 
     type: 'post', 
     data: 'product_id=' + product_id + '&quantity=' + quantity, 
     dataType: 'json', 

     beforeSend: function(){ 
      //add your preloader 
      $('body').append(preloader); 
      $('body').addClass('blur2'); 
      $('#pagefader2').fadeIn(70); 
     success: function (data) { 
      //do stuff with data and remove node 
      preloader.remove(); 
     } 
    },