Question

我有这个Javascript功能。当我单击按钮时，该按钮消失并显示进度条。如何注册时间已启动并运行其他功能？

$('#go').click(function() {
  console.log("moveProgressBar");

  $('.progress-wrap').removeClass('hidden');

  var getPercent = ($('.progress-wrap').data('progress-percent') / 100);
  var getProgressWrapWidth = $('.progress-wrap').width();
  var progressTotal = getPercent * getProgressWrapWidth;
  var animationLength = 1000;

  $('.progress-bar').stop().animate({
    left: progressTotal
    }, animationLength);
  $('#go').addClass('hidden');

});

http://codepen.io/TrueVineCS/pen/vuyxC

Answer 1

您可以使用.animate回调：

$('#go').click(function() {
  console.log("moveProgressBar");

  $('.progress-wrap').removeClass('hidden');

  var getPercent = ($('.progress-wrap').data('progress-percent') / 100);
  var getProgressWrapWidth = $('.progress-wrap').width();
  var progressTotal = getPercent * getProgressWrapWidth;
  var animationLength = 1000;

  $('.progress-bar').stop().animate({
       left: progressTotal
    }, 
    animationLength, 
    function(){
       // do on animation is complete
       $('#go').addClass('hidden');
  });

});

jQuery Documentation，your example

如何注册进度条已完成并运行另一个功能？

1 个答案: