2010-11-18 8 views
25

Estoy trabajando en un proyecto donde su framework usa jQuery 1.3.2 y jQueryUI 1.7.2.Utilizando diferentes versiones de jQuery y jQueryUI juntos

La actualización de las versiones en el marco no es una posibilidad, así que quería ejecutar jQuery 1.4.4 y jQueryUI 1.8.5 en paralelo.

he visto que las diferentes versiones de jQuery se pueden utilizar en paralelo, así:

<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> 

Pero, ¿esto también verdad para lo siguiente:

<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

El segundo bloque de código funciona realmente con fuentes CDN, sí, y se basa en el hecho de que la referencia a jQuery se borra antes de cargar la segunda versión. Es equivalente a la respuesta aceptada. –

Respuesta

12

yo sepa, no hay $.noConflict() equivalente para jQuery UI. Puede, sin embargo, utilizar una copia local de jQuery UI y envolver todo el JS usando un truco similar a lo que se utiliza para el aliasing las diferentes bibliotecas:

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

Esto podría implementarse elegantemente usando un script de construcción del lado del servidor o un controlador que sirve los archivos JS pero envuelve los contenidos con el código anterior.

No he probado este enfoque, por lo que puede que tenga que juguetear con el parámetro de función (aunque creo que es seguro suponer que usa jQuery para hacer referencia a jQuery dentro del código del complemento).

La manera en que se utiliza este es declarar las dos versiones de 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> 

... y luego se incluyen el código de interfaz de usuario, como he especificado anteriormente.

Y no, no puede hacer esto al hacer referencia a los archivos UI JS de Google CDN.

EDIT: El segundo bloque de código en la pregunta es en realidad una mejor solución que esta respuesta, ya que no requiere envolver el código de UI original en una función autoejecutable y pasar la versión específica. Ambos enfoques dan como resultado exactamente el mismo estado en la página.

+3

Esto anula por completo el propósito del contenedor, que es capturar la referencia a 'jQuery' antes de la llamada a' jQuery.noConflict (true) '. jQuery UI está diseñado para admitir esto de fábrica. La implementación propuesta en la pregunta es realmente correcta y funciona bien. –

1

Llegué a esta página porque tengo el mismo problema que el descrito en la pregunta original, pero la respuesta dada no la resuelve completamente (nunca más).

Necesitaba agregar una sugerencia automática a una página que tiene una gran cantidad de código usando jquery, no había una manera fácil de actualizar al nuevo jquery y jquery ui así que traté de usar la versión más nueva al lado de la anterior uno.

Además de editar la última línea jqueryui la interfaz de usuario jQuery tiene una gran cantidad de referencias de jQuery que es necesario cambiar también, así que utiliza un editor que puede reemplazar el uso de expresiones regulares y sustituye: \ bjQuery \ b con j $ 182

An en la página que ha añadido:

<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> 

Ahora ambos script existente en la página y el nuevo Auto sugieren están trabajando.

0

Acabo de encontrar una solución y me funciona.

En la biblioteca jQuery, después del último tipo de línea

var mySelector = $; 

Incluir la otra versión después de incluir esto en su página.

ahora, en todas las secuencias de comandos que desea utilizar con esta versión de jquery (incluso jquery ui y otras bibliotecas también), reemplace $ con mySelector. Use replaceall, habrá un par de lugares, como en las funciones de concordancia de expresiones regulares en las que desearía reemplazar mySelector de nuevo a $. Este problema me estaba molestando por bastante tiempo. Y simplemente se resolvió.

EDITADO: asegúrese de no reemplazar $ en el script original de jQuery.

Cuestiones relacionadas