如何扩展 jQueryUI datepicker 以接受附加参数？

我喜欢 jQueryUI datepicker 的可定制性足以允许按钮触发显示 datepicker，但不幸的是，它不允许您自定义自己的标记。

如果我有这样的标记：

<span>
    <input type="text" class="datepicker" />
</span>
<span>
    <button class="datepicker-trigger">Open</button>
</span>

为了让日期选择器在单击按钮时显示，我必须实现以下代码：

$('.datepicker').datepicker({
    showOn:'none'
});
$('.datepicker-trigger').click( function() {
    $('.datepicker').datepicker('show');
});

这是上述代码的 jsFiddle：http://jsfiddle.net/P9Qmu/ http://jsfiddle.net/P9Qmu/

这一切都很好，但我really想要做的是将 datepicker 函数传递一个附加参数，该参数指定一个对象或选择器，指示哪个元素应触发显示。

例如，我真的很希望能够做到这一点：

$('.datepicker').datepicker({
    showOn:'none',
    trigger:'.datepicker-trigger'
});

我知道如何扩展 jQuery 以添加方法和创建插件，但我不确定如何（或者是否可能）修改现有函数中允许的参数。

有谁知道我如何延长$.datepicker实现我想要做的事情或至少为我指明正确的方向？任何帮助将非常感激。

怎么样：

var __picker = $.fn.datepicker;

$.fn.datepicker = function(options) {
    __picker.apply(this, [options]);
    var $self = this;

    if (options && options.trigger) {
        $(options.trigger).bind("click", function () {
            $self.datepicker("show");
        });
    }
}

Usage:

$("#date").datepicker({
    trigger: "#button"
});

$("#date2").datepicker({
    trigger: "#button2"
});

Example: http://jsfiddle.net/gduhm/ http://jsfiddle.net/gduhm/

或者，使用您自己的 jQuery 插件来减少干扰：

$.widget("ui.datepicker2", {
    _init: function() {
        var $el = this.element;
        $el.datepicker(this.options);

        if (this.options && this.options.trigger) {
            $(this.options.trigger).bind("click", function () {
                $el.datepicker("show");
            });
        }
    }
});

（类似的用法，除了使用datepicker2或者无论你怎么称呼它）

Example: http://jsfiddle.net/puVap/ http://jsfiddle.net/puVap/