Проблемы с добавлением запятых к номерам

Question

Я внедрил запятую для roundNum, из которой я показываю общее число, которое перемещается;

$.fn.digits = function(){ 
     return this.each(function(){ 
      $(this).text($(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,")); 
     }); 
    }; 

$('.total').text(roundNum).digits(); 

Однако я не могу сделать то же самое с фактическим счетчиком.

$.fn.countTo = function(options) { 
    // merge the default plugin settings with the custom options 
    options = $.extend({}, $.fn.countTo.defaults, options || {}); 

    // how many times to update the value, and how much to increment the value on each update 
    var loops = Math.ceil(options.speed/options.refreshInterval), 
     increment = (options.to - options.from)/loops; 

    return $(this).each(function() { 
     var _this = this, 
      loopCount = 0, 
      value = options.from, 
      interval = setInterval(updateTimer, options.refreshInterval); 

     function updateTimer() { 
      value += increment; 
      loopCount++; 
      $(_this).html(value.toFixed(options.decimals)); 

      if (typeof(options.onUpdate) == 'function') { 
       options.onUpdate.call(_this, value); 
      } 

      if (loopCount >= loops) { 
       clearInterval(interval); 
       value = options.to; 

       if (typeof(options.onComplete) == 'function') { 
        options.onComplete.call(_this, value); 
       } 
      } 
     } 
    }); 
}; 

$.fn.countTo.defaults = { 
    from: 0, // the number the element should start at 
    to: 100, // the number the element should end at 
    speed: 1000, // how long it should take to count between the target numbers 
    refreshInterval: 100, // how often the element should be updated 
    decimals: 0, // the number of decimal places to show 
    onUpdate: null, // callback method for every time the element is updated, 
    onComplete: null, // callback method for when the element finishes updating 
}; 


$('.timer').countTo({ 
    from: 0, 
    to: roundNum, 
    speed: speed, 
    refreshInterval: 600, 
    onComplete: function() { 
     console.debug(this); 
    } 
}); 

Answer 1

Проблема в том, что это:

$('.total').text(roundNum) 

возвращает строку. Итак, когда вы попробуете добавить .digits() на конце его:

$('.total').text(roundNum).digits(); 

Он ищет метод .digits() на нитке, а не на объект JQuery, потому что это то, что $('.total').text(roundNum) возвращается.

Существует несколько возможных способов, в зависимости от того, как вы хотите, чтобы это работало. Возможно, что имеет больше смысла, чтобы просто сделать свой digits() код в простую функцию, которая принимает входящий номер или строку и возвращает разделители-Fied строки, так что вы можете просто сделать это:

$('.total').text(digits(roundNum));