Как расширить плагин Twitter Bootstrap

Question

Как расширить плагин Twitter Bootstrap

Я копаюсь в Twitter Bootstrap и теперь хочу попробовать добавить некоторые функции в плагины, но я не могу понять, как это сделать сделайте это. Используя в качестве примера модальный плагин ( http://twitter.github.com/bootstrap/javascript.html#modals ), я хотел бы добавить в плагин новую функцию, которая может называться так же, как и стандартные методы плагина. Я думаю, что ближе всего к этому я пришел со следующим кодом, но все, что я получаю, когда пытаюсь получить доступ, - это то, что функция не является частью объекта.

Есть предложения? это то, что я пробовал, и это кажется наиболее близким к тому, что мне нужно сделать:

 $.extend($.fn.modal, { 
    showFooterMessage: function (message) { 
        alert("Hey"); 
    } 
});

Тогда я бы назвал это следующим образом:

  $(this).closest(".modal").modal("showFooterMessage");

РЕДАКТИРОВАТЬ: Хорошо, я понял, как это сделать:

(function ($) {
    var extensionMethods = {
        displayFooterMessage: function ($msg) {
            var args = arguments[0]
            var that = this;

            // do stuff here
        }
    }

    $.extend(true, $.fn.modal.Constructor.prototype, extensionMethods);
})(jQuery);

Проблема с существующим набором плагинов Bootstrap заключается в том, что, если кто-то захочет их расширить, ни один из новых методов не сможет принимать аргументы. Моя попытка «исправить» заключалась в том, чтобы добавить принятие аргументов в вызов функции плагинов.

$.fn.modal = function (option) {
    var args = arguments[1] || {};
    return this.each(function () {
        var $this = $(this)
        , data = $this.data('modal')
        , options = typeof option == 'object' && option

        if (!data) $this.data('modal', (data = new Modal(this, options)))

        if (typeof option == 'string') data[option](args)
        else data.show()

    }) // end each
} // end $.fn.modal

45

jquery jquery-plugins twitter-bootstrap

задан Zain Shaikh 11 June 2013 в 07:55

2 ответа

Другие вопросы по тегам:

jquery jquery-plugins twitter-bootstrap

Похожие вопросы:

score 29 · Answer 1

Для записи существует простой метод переопределения или расширения существующих функций:

var _show = $.fn.modal.Constructor.prototype.show;

$.fn.modal.Constructor.prototype.show = function() {
    _show.apply(this, arguments);
    //Do custom stuff here
};

Не распространяется на пользовательские аргументы, но это легко и с помощью метода выше; вместо использования apply и arguments укажите исходные аргументы плюс пользовательские аргументы в определении функции, затем вызовите исходный _show (или какой бы то ни было) с исходными аргументами и, наконец, сделайте другие вещи с новым аргументы.

score 2 · Answer 2

Для тех, кто хочет сделать это с помощью Bootstrap 3. Расположение плагинов немного изменилось, к конструктору плагинов добавлены параметры по умолчанию для всех плагинов Bootstrap 3:

var _super = $.fn.modal;
$.extend(_super.Constructor.DEFAULTS, {
       foo: 'bar',
       john: 'doe'
});