Довольно легко превратить ваш код прямо в плагин jQuery, готовый для использования на любом веб-сайте. Сложнее всего найти способ правильно структурировать ваш код, чтобы он был независимым и простым в использовании.
Преимущество преобразования кода JQuery в плагин
- эффективная организация кода JQuery
- ваш код становится легче модифицировать и следовать
- повторяющиеся задачи обрабатываются естественным путем
- улучшает скорость, с которой вы развиваете
- плагины организованы и способствуют повторному использованию кода
Создание jQuery плагинов Советы
Оставьте детали вне кода (т.е. все, что напрямую связано с примером, для которого используется код jQuery).
Перепишите код, чтобы включить объект «this» вместо жесткого кодирования селектора, чтобы сделать его более общим
Сделать JavaScript и CSS код плагина для разделения файлов
Структура плагина jQuery
// Вам нужна анонимная функция, чтобы обернуть вашу функцию, чтобы избежать конфликта (function ($) {// Присоедините этот новый метод к jQuery $ .fn.extend ({// Здесь вы пишете имя вашего плагина pluginname: function ( ) {// Перебрать текущий набор соответствующих элементов return this.each (function () {// код, который нужно вставить сюда});}}); // передать функцию jQuery, // чтобы мы могли использовать любое допустимое имя переменной Javascript // для замены знака «$». Но мы будем придерживаться $ (мне нравится знак доллара:))}) (jQuery);
Как конвертировать jQuery Code в плагин
Все, что вам нужно сделать, это расширить объект $ .fn своей собственной функцией (давайте не будем изобретать колесо, см. Пример ниже!).
Примеры простых плагинов jQuery и учебные пособия
- Простое учебное пособие по плагину для анимации меню
- Плагины / Авторская Официальная Документация
- Учебное пособие по плагину jQuery, углубленное изучение для начинающих
- Как создать простой плагин jQuery для слайдера контента
- Полное руководство по созданию практического плагина jQuery
- Как создать плагин для jQuery
- Узнайте, как создать плагин jQuery
- Шаблон разработки плагинов