JQuery конфликтует с другой библиотекой JQuery

Question

Я использую jquery для модуля. Мой шаблон Joomla имеет встроенное меню jquery. Поэтому они конфликтуют друг с другом.

Есть ли способ решить эту проблему. После кода скрипта модуля

<script type="text/javascript" charset="utf-8">
    window.onload = function () {
        var container = jQuery('div.sliderGallery');
         var ul = jQuery('ul', container);

         var itemsWidth = ul.innerWidth() - container.outerWidth();

         jQuery('.slider', container).slider({
             min: 0,
             max: itemsWidth,
             handle: '.handle',
             stop: function (event, ui) {
                 ul.animate({'left' : ui.value * -1},340);
             },
             slide: function (event, ui) {
                 ul.css('left', ui.value * -1);
             }
         });
     };
</script>

Answer 1

Что вам нужно сделать, чтобы решить вашу проблему, это снять псевдоним с функции jQuery и присвоить ее другому имени переменной (помните: переменные могут быть функциями). Вам необходимо использовать функцию jQuery.noConflict(), чтобы отключить функцию $(). Вот один, чтобы сделать это:

// ...after all of Joomla's JS is done executing...

// before loading your version of jQuery var jquery = {}; // aka new Object()
jquery.joomla = jQuery.noConflict(); // moves jQuery into another namespace

// load your version

Теперь, когда вы загрузите вашу версию, она займет пространства имен jQuery и $, но у вас все равно будет другая ссылка на функцию jQuery в Joomla, если вам это нужно. Чтобы повторить, основной поток:

1. Загрузить jQuery от Joomla
2. Запустите jQuery-зависимый код Joomla
3. Перемещение Joomla jQuery в другое пространство имен
4. Загрузите ваш jQuery
5. Выполните ваш код, используя $()

Answer 2

попробуй

var J = jQuery.noConflict();

после этого используйте переменную J вместо $ или jQuery для своего пользовательского кода

Answer 3

попробуй

jQuery.noConflict();

* 1004 например *

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        var container = jQuery('div.sliderGallery');
         var ul = jQuery('ul', container);

         var itemsWidth = ul.innerWidth() - container.outerWidth();
         jQuery.noConflict();
         jQuery('.slider', container).slider({
             min: 0,
             max: itemsWidth,
             handle: '.handle',
             stop: function (event, ui) {
                 ul.animate({'left' : ui.value * -1},340);
             },
             slide: function (event, ui) {
                 ul.css('left', ui.value * -1);
             }
         });
     });
</script>

Я обновил ваш код, чтобы использовать jQuery для проверки загруженного документа. Подробности использования функции noConflict: здесь .

Answer 4

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

(function($){
   $(document).ready(function(){

      $('div').click( function(){ alert('ding'); });

   });
})(jQuery);

Это создает частную область видимости, поэтому вам не нужно беспокоиться о каких-либо столкновениях. Вы можете пропустить все неприятности с jQuery.noConflict (); решение, и вы не должны отказываться от этого замечательного $! Я делаю это из-за хаббита, когда я знаю, что в работе есть другие куски кода (например, любые cms) - даже если новое расширение добавлено после моего тестирования, оно не должно нарушать мой jQuery.

Отличный обзор в jQuery Cookbook (http://listic.ru/jQuery_Cookbook.pdf - глава 1.17). Если это достаточно хорошо для Ресига, думаю, это сработает для меня!

Answer 5

Вы имели в виду, что ваша Joomla загружала 2 вида jquery одновременно? 1-й ваш меню загрузки JQuery а потом твой модуль загружает jquery?

вот решения: В шаблонах joomla мы можем переопределить представления модуля или компонента (я полагаю, вы должны использовать joomla 1.5.x, верно?)

1. в ваших шаблонах создайте каталог с именем html / например: templates / yourTemplate / html /

2. Скопируйте файл из modules / mod_yourMenu / tmpl /.* в ваш шаблон HTML (templates / yourTemplate / html / mod_yourMenu /) -> * вам не нужно добавлять tmpl / *

3. отредактируйте файлы php внутри и удалите все тег, который загружает jquery

4. выполните шаги 1-3 для модулей, использующих jquery.

5. отредактируйте ваш шаблон, поставьте тег для загрузки последней версии jquery.

теперь должно работать :)