2010-11-18 15 views
25

Pracuję nad projektem, w którym jego struktura korzysta z jQuery 1.3.2 i jQueryUI 1.7.2.Używanie różnych wersji jQuery i jQueryUI razem

Aktualizacja wersji w ramach nie jest możliwa, dlatego chciałem równolegle uruchomić jQuery 1.4.4 i jQueryUI 1.8.5.

Widziałem, że różne wersje jQuery mogą być stosowane równolegle tak:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
     var j$132 = $.noConflict(true); 
    </script> 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
    <script type="text/javascript"> 
     var j$144 = $.noConflict(true); 
    </script> 

Ale byłoby to również prawdziwe dla następujących elementów:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 
     var j$132 = $.noConflict(true); 
    </script> 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 
     var j$144 = $.noConflict(true); 
    </script> 
+6

Drugi blok kodu faktycznie działa ze źródłami CDN, tak i polega na tym, że odniesienie do jQuery zostało wyczyszczone przed załadowaniem drugiej wersji. Jest to odpowiednik przyjętej odpowiedzi. –

Odpowiedz

12

AFAIK, nie ma $.noConflict() równoważny dla interfejsu użytkownika jQuery. Można jednak użyć lokalną kopię jQuery UI i owinąć całą JS stosując podobną sztuczkę do czego używasz do aliasing różnych bibliotek:

(function(jQuery) { 
    // ... the jQuery UI lib code for jQuery 1.3.2 
})(j$132); 

To może być elegancko realizowane za pomocą kompilacji skryptu po stronie serwera lub obsługi obsługującej pliki JS, ale opakowuje zawartość z powyższym kodem.

Nie testowałem tego podejścia, więc być może będziesz musiał bawić się z parametrem funkcji (chociaż myślę, że można bezpiecznie założyć, że używa jQuery do odniesienia się do jQuery w kodzie wtyczki).

Sposób byłoby użyć to zadeklarować obie wersje jQuery:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    var j$132 = $.noConflict(true); 
</script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
<script type="text/javascript"> 
    var j$144 = $.noConflict(true); 
</script> 

... a następnie podać swój kod UI, jak już podano powyżej.

I nie, nie można tego zrobić, odwołując się do plików JS interfejsu użytkownika z Google CDN.

EDIT: Drugi blok kodu w tej kwestii jest rzeczywiście lepsze rozwiązanie niż tej odpowiedzi, ponieważ nie wymaga zawijania oryginalnego kodu UI w samodzielnym wykonywaniu funkcji i przechodzącej konkretną wersję. Oba podejścia prowadzą do dokładnie tego samego stanu na stronie.

+3

To całkowicie psuje cel opakowania, który polega na przechwyceniu odwołania do 'jQuery' przed wywołaniem' jQuery.noConflict (true) '. Interfejs jQuery został zaprojektowany do obsługi tego po wyjęciu z pudełka. Proponowana implementacja w pytaniu jest rzeczywiście poprawna i działa dobrze. –

1

Mam na tej stronie, ponieważ mam ten sam problem, co opisano w pierwotnym pytaniu, ale udzielona odpowiedź nie rozwiązuje go całkowicie (już).

Potrzebowałem dodać automatyczne sugerowanie do strony, która ma dużo istniejącego kodu za pomocą jquery, nie było prostego sposobu na aktualizację do nowego jquery i jquery ui, więc próbowałem użyć nowszej wersji obok starej jeden.

Poza edycji jQueryUI ostatnia linia UI jQuery ma wiele odniesień jQuery, że trzeba jak dobrze więc użyłem edytora, który może zastąpić za pomocą wyrażenia regularnego i zastąpić zmienić: \ bjQuery \ b z j $ 182

na stronie dodałem:

<script src="http://code.jquery.com/jquery-1.8.2.js"></script> 
    <script type="text/javascript"> 
     var j$182 = $.noConflict(true); 
     </script> 
<script type="text/javascript" src="jqueryui1.9.0.js"></script> 

teraz zarówno istniejący skrypt na stronie, a nowe auto sugerują pracują.

0

Właśnie wymyśliłem rozwiązanie i to działa dla mnie.

W bibliotece jQuery po ostatnim typu linii

var mySelector = $; 

Dołącz innej wersji po to to na swojej stronie.

teraz we wszystkich skryptach, których chcesz używać z tą wersją jquery (nawet jquery ui i inne biblioteki), zamień $ na mySelector. Użyj opcji replaceall, będzie kilka miejsc, jak w funkcjach dopasowywania wyrażenia regularnego, w których chcesz zastąpić mySelector powrotem do $. Ten problem przez długi czas mnie dręczył. I to właśnie zostało rozwiązane.

EDYTOWANA: upewnij się, że nie zamieniasz żadnych $ w oryginalnym skrypcie jQuery.

Powiązane problemy