jQuery插件选项无法解析元素事件

时间:2011-03-24 18:37:09

标签: javascript jquery events jquery-plugins

我在创建下面的插件时遇到问题。 “roundWholeNumber”函数中的“factorOf”变量始终解析为“undefined”。我假设这是因为我没有正确设置事件。谢谢你的帮助。

鉴于以下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);

1 个答案:

答案 0 :(得分:0)

这是您使用的匿名绑定功能。看看你这样绑定的时间

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

options变量成为jQuery设置的event object

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

在定义中删除options,它将在函数内成功评估。

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