jQuery - 停止继续运行前一个功能

Question

我有一个函数，当用户输入数据来设置里程表（计数器变量中的脚本底部）时调用。如果用户想要更改任何字段，他们只需在表格中放入一些新数据，里程表就会重置并重新开始。

我现在的问题是前面的功能（jOdometer）仍然运行以前的数据以及新的设置里程表。如何停止运行以前的功能并重新启动？

我希望我可以做到以下几点...

$(function(){ 

     var counter; 

     $('#submit').click(function(){ 

      if(counter != undefined){ 
       counter.stop(); 
      } 

      // get values from user. 
      var counter_start = 0; 
      var counter_end = 0; 
      var increment = 0; 
      var delayTime = 0; 
      var speed = 0; 
      var extraDigits = []; 

      if($('#counter_end').length > 0){ 
       counter_end = $('#counter_end').val(); 
      }else{ 
       counter_end = false; 
      } 
      if($('#counter_start').length > 0){ 
       counter_start = $('#counter_start').val(); 
       if(counter_end.length > counter_start.length){ 
        for(i=counter_start.length+1; i<=counter_end.length; i++){ 
         extraDigits = '0' + extraDigits; 
        } 
        if(extraDigits.length > 0){ 
         counter_start = extraDigits + counter_start 
        } 
       } 
      }else{ 
       counter_start = 1; 
      } 
      if($('#increment').length > 0){ 
       increment = $('#increment').val(); 
      }else{ 
       increment = 1; 
      } 
      if($('#delay_time').length > 0){ 
       delayTime = $('#delay_time').val(); 
      }else{ 
       delayTime = 500; 
      } 
      if($($('#delay_time')).length > 0){ 
       delayTime = $('#delay_time').val(); 
      }else{ 
       delayTime = 1000; 
      } 

      counter = $('.counter4').jOdometer({ 
       counterStart: String(counter_start), 
       counterEnd: String(counter_end), 
       delayTime: parseInt(delayTime), 
       increment: parseInt(increment), 
       speed: parseInt(speed), 
        formatNumber: true, 
       spaceNumbers: 0, 
       widthDot: 10 
      }); 
     }) 

    }); 

但是不起作用。我究竟做错了什么？

Answer 1

jOdometer似乎只有一个.goToNumber()方法 - 没有.stop()或destroy()。

我认为唯一可行的方法是用新的DOM元素替换里程表，然后初始化它。

试试这个：

$(function() { 
    var c = $('#counter4').hide(), 
     counter; 
    $('#submit').click(function(){ 
     var counter_start = parseInt($('#counter_start').val()) || 1; 
     var counter_end = parseInt($('#counter_end').val()) || 0; 
     var counter_start_digits = counter_start.toString().length; 
     var counter_end_digits = counter_end.toString().length; 
     var padding = []; 
     if(counter_end_digits > counter_start_digits) { 
      for(var i=counter_start_digits+1; i<=counter_end_digits; i++) { 
       padding.unshift('0'); 
      } 
     } 
     if(counter) { 
      counter.remove(); 
     } 
     counter = c.clone().insertAfter(c).show().jOdometer({ 
      counterStart: padding.join('') + counter_start, 
      counterEnd: counter_end || false, 
      delayTime: parseInt($('#delay_time').val()) || 1000, 
      increment: parseInt($('#increment').val()) || 1, 
      speed: 0, 
      formatNumber: true, 
      spaceNumbers: 0, 
      widthDot: 10 
     }); 
    }); 
}); 

未经检验

Answer 2

您可以使用event.stopPropagation();停止运行事件。