未解析元素事件的jQuery插件選項

Question

我在創建下面的插件時遇到問題。 「roundWholeNumber」函數中的「factorOf」變量始終解析爲「未定義」。我假設這是因爲我沒有正確設置事件。感謝您的任何幫助。

給出下面的HTML：

使用以下選擇

<input type="text" value="12" class="rounder-wholeNumber" /> 

測試：

jQuery('input.rounder-wholeNumber').numericRounder({ onEvent: 'change', factorOf: 1000 }) 

對於以下插件：

(function($) { 
    /// <summary>Creates and initializes the plug-in.</summary> 
    $.fn.extend({ 
     numericRounder: function(options) { 

      switch (typeof (options)) { 
       case 'object': 
        options = $.extend({}, $.numericRounder.defaults, options); 
        break; 
       case 'string': 
        options = $.extend({}, $.numericRounder.defaults, { onEvent: options }); 
        break; 
       default: 
        options = $.numericRounder.defaults; 
      } 

      this.each(function() { 
       new $.numericRounder(this, options); 
      }); 
      return; 
     } 
    }); 

    /// <summary>Plug-in definition.</summary> 
    $.numericRounder = function(control, options) { 

     var element = $(control); 

     if (element.is('input.rounder-decimal')) { 
      switch (options.onEvent) { 
       case 'change': 
        element.change(roundDecimal); 
        break; 
       case 'blur': 
        element.blur(roundDecimal); 
        break; 
       case 'click': 
        element.click(roundDecimal); 
        break; 
       default: 
        element.blur(roundDecimal); 
      } 
     } 

     if (element.is('input.rounder-wholeNumber')) { 
      switch (options.onEvent) { 
       case 'change': 
        element.change(function(options) { roundWholeNumber(this, options.factorOf); }); 
        break; 
       case 'blur': 
        element.blur(function(options) { roundWholeNumber(this, options.factorOf); }); 
        break; 
       case 'click': 
        element.click(function(options) { roundWholeNumber(this, options.factorOf); }); 
        break; 
       default: 
        element.blur(function(options) { roundWholeNumber(this, options.factorOf); }); 
      } 
     } 

     /// <summary>Rounds a numeric value to the nearest place.</summary> 
     function roundDecimal() { 

      var value = $(this).val(); 
      value = extractValue(value); 

      if (isNaN(value)) 
       value = $(this).val(); 
      else 
       value = Math.round(value).toFixed(2); 

      $(this).val(value); 
     } 
     /// <summary>Rounds a numeric value to the nearest place.</summary> 
     function roundWholeNumber(element, factorOf) { 

      var value = $(element).val(); 
      value = extractValue(value); 

      if (isNaN(value)) 
       value = $(element).val(); 
      else 
       value = Math.round(value/factorOf) * factorOf; 

      $(element).val(value); 
     } 
     /// <summary></summary> 
     function extractValue(element) { 
      var numericRegEx = /([\d\.])/g; 

      try { 
       return element.match(numericRegEx).join(''); 
      } 
      catch (error) { 
       return element; 
      } 
     } 
    }; 

    /// <summary>Default options.</summary> 
    $.numericRounder.defaults = { onEvent: 'change', factorOf: 10 }; 
})(jQuery); 

Answer 1

這是您使用的匿名綁定函數。看到當你綁定這樣

element.change(function(options) { roundWholeNumber(this, options.factorOf); }); 

options變量成爲event object的jQuery設置。

element.change(function(options) { options.preventDefault(); } ) //see ?:) 

只要在定義中除掉options，它將在函數內部成功評估。

element.change(function() { roundWholeNumber(this, options.factorOf); });