jQuery动画回调不起作用

jQuery animation callback doesn't work

本文关键字：不起作用 回调 动画 jQuery      更新时间：2023-09-26

为什么不触发警报?

var $anchor = $(this);
$('.hide').val($(this).attr('href'));
$('html, body').animate({
    scrollLeft: $($anchor.attr('href')).offset().left
}, {
    queue: false,
    duration: 1000,
    easing: 'easeInOutCirc'
}, function () {
    alert('test');
});

您可以在.animate()中使用多种不同的语法选项。当你传递一个属性对象和一个选项对象时(就像你正在做的那样)，补全函数进入选项对象，而不是像这样作为第三个参数:

var $anchor = $(this);
$('.hide').val($(this).attr('href'));
$('html, body').animate({
    scrollLeft: $($anchor.attr('href')).offset().left
  }, {
    queue: false,
    duration: 1000,
    easing: 'easeInOutCirc',
    complete: function () {
        alert('test');
    }
  }
);

这在jQuery .animate()文档中有详细描述。

.animate( properties, options )
properties - A map of CSS properties that the animation will move toward.
options - A map of additional options to pass to the method. Supported keys:
    duration: A string or number determining how long the animation will run.
    easing: A string indicating which easing function to use for the transition.
    complete: A function to call once the animation is complete.
    step: A function to be called after each step of the animation.
    queue: A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string.
    specialEasing: A map of one or more of the CSS properties defined by the properties argument and their corresponding easing functions (added 1.4).

尝试指定第三个参数为"complete"，如下所示:

var $anchor = $(this);
$('.hide').val($(this).attr('href'));
$('html, body').animate({
    scrollLeft: $($anchor.attr('href')).offset().left
}, {
    queue: false,
    duration: 1000,
    easing: 'easeInOutCirc'
}, complete: function () {
    alert('test');
});
相关文章：