Инициализация собственных плагинов - PullRequest
2 голосов
/ 04 января 2011

Я написал несколько плагинов jquery для моего клиента. Я хочу написать функцию, которая будет инициализировать каждый плагин, который был загружен.

Пример:

<script src="/Scripts/jquery.plugin1.min.js")" type="text/javascript"></script>
<script src="/Scripts/jquery.plugin2.min.js")" type="text/javascript"></script>
<script src="/Scripts/jquery.initializer.min.js")" type="text/javascript"></script>

Здесь я загрузил plugin1 и plugin2. Plugin1 должен быть присоединен ко всем ссылкам с именем класса «ajax», а plugin2 - ко всем div с именем класса «test2»:

$('document').ready(function(){
     $('a.ajax').plugin1();
     $('div.test2').plugin2();
}

Я знаю, что могу использовать jQuery().pluginName, чтобы проверить, существует ли плагин. Но я хочу иметь более гибкий путь. Могут ли все загруженные плагины зарегистрировать функцию инициализации в массиве или что-то в этом роде, что я в document.ready могу перебирать и вызывать?

как:

 //in plugin1.js
 myCustomPlugins['plugin1'] = function() { $('a.ajax').plugin1(); };

 // and in the initializer script:
 myCustomPlugins.each(function() { this(); };

Угадай, все сводится к трем вопросам:

  1. Как использовать "глобальный" массив jquery?
  2. Как перебрать этот массив для вызова зарегистрированных методов
  3. Есть ли лучший подход?

Обновление для ответа на комментарий

a) Потому что я создаю новую платформу для моего клиента на основе ASP.Net MVC3, и все их разработчики привыкли к функциональности перетаскивания в WebForms. Я хочу сделать переход как можно более плавным, так как у них нет знаний о jquery. Большой плюс заключается в том, что им нужно только включить скрипт jquery, чтобы получить новую функциональность. Использование отдельного скрипта инициализатора также позволяет отключить эту функцию, когда они лучше знают jquery.

b) Я использую Ajax для обновления некоторых div с помощью возврата HTML. HTML должен быть обработан всеми плагинами для добавления функциональности плагина, иначе все обновленные части не будут работать, как описано выше.

Почему это важно, ПОЧЕМУ я хочу это сделать? :) Это не то, что очень сложно.

1 Ответ

0 голосов
/ 04 января 2011

Вы можете создать массив следующим образом:

$.myPlugins = [
    {plugin: "plugin1", selector: "a.ajax"},
    {plugin: "plugin2", selector: "div.test2"}
];

И функция для запуска всех плагинов, как это:

function initPlugins() {
    for (var i = 0, item; item = $.myPlugins[i]; i++) {
        $(item.selector)[item.plugin]();
    }
}

Теперь запустите эту функцию на DOM ready и на AJAX complete:

$(document).ready(initPlugins).ajaxComplete(initPlugins);

Однако возможно, что с помощью этого метода некоторые элементы могут быть инициализированы более одного раза. Вы можете использовать класс как флаг, чтобы предотвратить это в initPlugins():

function initPlugins() {
    for (var i = 0, item; item = $.myPlugins[i]; i++) {
        $(item.selector).not(".already").addClass("already")[item.plugin]();
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...