Question

我试图在ajax调用成功响应后调用函数。

这两个功能：

      function waggle() {
       var element = $(this);
          var tmpClass = element.attr('class');
          element.removeClass();
          setTimeout(function() {
            element.offsetWidth = element.offsetWidth;
            element.addClass(tmpClass).addClass('start-now');
          }, 10);
    }

    function auto_load(){
    $.ajax({
      type: 'POST',
      data: {room_id:'$r_room_id',site_id:'$r_site_id'},
      url: 'cart_counter.php',
      success: function(data){
        $('#cart_buble').html(data);
        waggle();
      }
    });
  }

这确实会按预期的方式用购物车中的数字更新 #cart_buble div，但不会执行负责调用css过渡效果的 waggle 函数。

两个功能都可以单独正常工作。

Answer 1

我认为this变量是这里的问题。这种函数声明可以更改存储在this变量中的数据，直到执行该函数为止。

尝试这种方式

function waggle() {
       var element = $(...); // <--- Query your element instead of using `this`
          var tmpClass = element.attr('class');
          element.removeClass();
          setTimeout(function() {
            element.offsetWidth = element.offsetWidth;
            element.addClass(tmpClass).addClass('start-now');
          }, 10);
    }

    function auto_load(){
    $.ajax({
      type: 'POST',
      data: {room_id:'$r_room_id',site_id:'$r_site_id'},
      url: 'cart_counter.php',
      success: function(data){
        $('#cart_buble').html(data);
        waggle();
      }
    });
  }

在成功响应来自Ajax调用的数据后，还要处理其他功能

1 个答案: