Tengo una aplicación que requiere el uso de un calendario de mootools, sin embargo, uso jquery para la estructura de mi aplicación principal.

Tan pronto como tengo mootools con jquery, ninguno funciona, y cuando tengo solo uno, funcionan bien. Investigué un poco diciendo que podría usar un método llamado .noconflict, y aunque lo intenté, no lo he conseguido para resolver mi problema. Quizás alguien podría explicarme mejor dónde hacer las llamadas reales .noconflict, y quizás ayudarme a que esto funcione.

¡Gracias!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var fixHeight = function () {
                var gutter = 50;
                var newHeight = $(window).height() - (gutter*2);
                $('#container').height(newHeight);
        }
        $(function(){ 

            fixHeight();
            $('ul#nav li.item').each(function(index) {
                if ($(this).attr("name") == "media") {
                    $(this).attr("id","active");
                }
            });
            $('input').focus(function() {
                $(this).attr("value","");
            }).blur(function() {
                $(this).attr("value",$(this).attr("original-value"));
            });

            $(window).resize(function() {
                fixHeight();
            }).load(function() {
                fixHeight();
            });

        });  
     </script>
     <script type="text/javascript" src="http://taptouchclick.com/js/mootools-1.2.4-core-yc.js"></script>
     <script type="text/javascript">
        window.addEvent('domready', function(){
             var smoothCalendar = new SmoothCalendar("calendar");
        });
    </script>
0
willium 21 may. 2011 a las 10:37

3 respuestas

La mejor respuesta

Deberías estar bien si simplemente llamas:

jQuery.noConflict();

... antes de incluir el archivo Mootools JS.

Luego puede usar las funciones de jQuery usando jQuery en lugar de $. Ejemplo:

jQuery('.selector').hide();  // instead of $('.selector').hide();
1
Nathan Osman 21 may. 2011 a las 06:41

Sí, el método noConflict debería funcionar, pero si no lo hace o si desea hacerlo de otra manera, debe encapsular los scripts en funciones de llamada automática con el parámetro establecido como el objeto principal de la biblioteca:

(function($){
    // al your jquery logic here
    alert($ instanceof jQuery);
})(jQuery)

Después de eso, debe incluir la siguiente biblioteca (en su caso, MooTools) y escribir el script normalmente, o, para estar muy seguro, también puede encapsular la lógica de MooTools en una función.

2
gion_13 23 may. 2011 a las 05:05

También puede pasar $ a través del evento listo para DOM:

$.noConflict();

// Non-jQuery code goes here

jQuery(document).ready(function($) {
    // You can now use the dollar sign safely inside of this function
}
0
restlessdesign 24 may. 2011 a las 17:32