Question

我正在尝试创建一个使用选项的基本插件，然后创建一个使用set选项的对象的方法。

 $.sn_Watermark = $.sn_Watermark || {
        options: {
            waterMarkText: "Watermark Text",
            className: "watermarked"
        },
        show: function(selector) {
            $(selector)
                .addClass("watermarked")
                .val("Watermark Text");
        }
    };  

   $.fn.sn_Watermark = $.fn.sn_Watermark || function (options) {
            if(options == null)
                options = $.sn_Watermark.options;
            else
                options = $.extend($.sn_Watermark.options, options);

            return this.each(function () {
                $tb = $(this);
                    if ($tb.val() == "" || $tb.val() == options.waterMarkText ) {
                        $tb.addClass(options.className);
                        $tb.val(options.waterMarkText);
                    }
                }).focus(function () {
                    $tb = $(this);
                    if ($tb.val() == options.waterMarkText) {
                        $tb.val("");
                        $tb.removeClass(options.className);
                    }
                }).blur(function () {
                //var clearLnk = "[LnkClearRowNum=" + $tb.attr('TextBoxRowNum') + "]";
                if ($tb.val() == '') {
                    // $(clearLnk).hide();
                    $tb.addClass(options.className);
                    $tb.val(options.waterMarkText);
                }
                else if ($tb.val() == options.waterMarkText){ //if user types in water mark text
                    $tb.addClass(options.className);
                }
                else {
                    //$(clearLnk).show();
                    $tb.removeClass(options.className);
                }
            });
        };

    $(document).ready(function () {
      $("[TextBoxRowNum]").sn_Watermark({waterMarkText: "My Text"} );
      $.sn_Watermark.show("[TextBoxRowNum]");
   });

因此，当我调用show时，它使用“硬编码”默认值。我试图做这样的事情，但没有任何运气。

 $.sn_Watermark = $.sn_Watermark || {
        options: {
            waterMarkText: "Watermark Text",
            className: "watermarked"
        },
        show: function(selector) {
            $(selector)
                .addClass(options.waterMarkTest)
                .val(options.className);
        }
    };

所以我的问题是，是否有一种简单的方法可以传递show方法中的选项？

Answer 1

我认为没有理由通过extend来创建一个外部方法来应用这些选项。

为什么不尝试将选项放在插件函数中，然后扩展它们？

Answer 2

$.sn_Watermark = $.sn_Watermark || {
    options: {
        waterMarkText: "Watermark Text",
        className: "watermarked"
    },
    show: function(selector) {
        $(selector)
            .addClass($.sn_Watermark.options.className)
            .val($.sn_Watermark.options.waterMarkText);
    }
};

知道了。让它称之为自我。

jQuery - 创建使用已配置选项的公共方法

2 个答案: