Question

我正在尝试修改Jquery插件来修复错误。

以下是所有相关联的代码：

$('.' + settings.activeClass).live('click', function(){
    select(this);
    alert( $('#pg li.selected').height() );
    .......
});

function select(el){
hideSelected(function(){
    $(el).addClass('selected').removeClass('active');
    $(el).animate(settings.selectedCSS, 'slow');

});
}

因此，在添加“选定”类之前，高度约为116px

$(el).addClass('selected').removeClass('active');

在添加“选定”类后，高度应该约为378px 如在渲染的html页面上显示，高度更新为378px

alert( $('#pg li.selected').height() );

但是，当我尝试打印高度值时，它仍会在添加“选定”类之前捕获旧值。

这是一个奇怪的部分，我添加了警告框来打印添加'选定'类之后的高度值，它应该抓住高度的新值，但显然不是。

所以，我想到了一个解决方案，也许JQuery在点击事件后有某种事件？或任何替代解决方案？

Answer 1

您的动画将执行警报的异步。您需要在动画回调中处理您希望实现的任何内容：

http://api.jquery.com/animate/

所以喜欢：

$('.' + settings.activeClass).live('click', function(){
  select(this);
  // NOT HERE alert( $('#pg li.selected').height() );
  .......
});

function select(el){
  hideSelected(function(){
    $(el).addClass('selected').removeClass('active');
    $(el).animate(settings.selectedCSS, 'slow', function(){
      //here
      alert( $('#pg li.selected').height() );
    });
  });
}

编辑：正如我的评论中所提到的，您还可以选择传递一个布尔参数来告诉animate函数异步或同步处理：

Animate API：http://api.jquery.com/animate/

与处理队列相关的特定文本：

.animate( properties, options ) * properties：动画将移向的CSS属性的映射。 optionsA传递给方法的其他选项的映射。

支持的密钥：

duration：确定动画运行时间的字符串或数字。
easing：一个字符串，指示要使用的缓动函数过渡。
complete：动画完成后调用的函数。步骤：A 在动画的每个步骤之后调用的函数。
queue：一个布尔值，指示是否将动画放置在效果中队列。如果为false，则动画将立即开始。截至jQuery 1.7，queue选项也可以接受一个字符串，在这种情况下，动画被添加到该字符串所代表的队列中。
specialEasing：由一个或多个CSS属性定义的映射 properties参数及其相应的缓动函数（补充1.4）。

jQuery AFTER点击事件

1 个答案: