jQuery和Mootools冲突

-1

我知道有很多热门的文章使用jQuery与mootools，但我做错了什么。jQuery和Mootools冲突

原头MooTools的+ jQuery的：

<head> 
<?php css(); ?> 
<meta name="viewport" content="width=device-width" /> 
<meta content="text/html; charset=<?php print $this->getConfig('charset'); ?>" http-equiv="content-type" /> 
<?php 
if(($this->getConfig('log_file') != null && strlen($this->getConfig('log_file')) > 0) 
    || ($this->getConfig('thumbnails') != null && $this->getConfig('thumbnails') == true && $this->mobile == false)) 
{ 
?> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://www.livadi.gr/ib/sources/js/mootools.js"></script> 
<script type="text/javascript"> 
//<![CDATA[ 

$(document).ready(function() { 
<?php 
    if($this->logging == true) 
    { 
?> 
     function logFileClick(path) 
     { 
      $.ajax({ 
        async: false, 
        type: "POST", 
        data: {log: path}, 
        contentType: "application/x-www-form-urlencoded; charset=UTF-8", 
        cache: false 
       }); 
     } 

     $("a.file").click(function(){ 
      logFileClick("<?php print $this->location->getDir(true, true, false, 0);?>" + $(this).html()); 
      return true; 
     }); 
<?php 
    } 
    if(EncodeExplorer::getConfig("thumbnails") == true && $this->mobile == false) 
    { 
?> 
     function positionThumbnail(e) { 
      xOffset = 30; 
      yOffset = 10; 
      $("#thumb").css("left",(e.clientX + xOffset) + "px"); 

      diff = 0; 
      if(e.clientY + $("#thumb").height() > $(window).height()) 
       diff = e.clientY + $("#thumb").height() - $(window).height(); 

      $("#thumb").css("top",(e.pageY - yOffset - diff) + "px"); 
     } 

     $("a.thumb").hover(function(e){ 
      $("#thumb").remove(); 
      $("body").append("<div id=\"thumb\"><img src=\"?thumb="+ $(this).attr("href") +"\" alt=\"Preview\" \/><\/div>"); 
      positionThumbnail(e); 
      $("#thumb").fadeIn("medium"); 
     }, 
     function(){ 
      $("#thumb").remove(); 
     }); 

     $("a.thumb").mousemove(function(e){ 
      positionThumbnail(e); 
      }); 

     $("a.thumb").click(function(e){$("#thumb").remove(); return true;}); 
<?php 
    } 
?> 
    }); 
//]]>     
</script> 
<?php 
} 
?> 
<title><?php if(EncodeExplorer::getConfig('main_title') != null) print EncodeExplorer::getConfig('main_title'); ?></title> 
</head>

现在我已经把jQuery.noConflict();并与jQuery取代$。之后，MooTools正在通过jQuery工作。

头有了一些变化：

<head> 
<?php css(); ?> 
<meta name="viewport" content="width=device-width" /> 
<meta content="text/html; charset=<?php print $this->getConfig('charset'); ?>" http-equiv="content-type" /> 
<?php 
if(($this->getConfig('log_file') != null && strlen($this->getConfig('log_file')) > 0) 
    || ($this->getConfig('thumbnails') != null && $this->getConfig('thumbnails') == true && $this->mobile == false)) 
{ 
?> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://www.livadi.gr/ib/sources/js/mootools.js"></script> 
<script type="text/javascript"> 
//<![CDATA[ 
    //no conflict jquery 
    jQuery.noConflict(); 
    //jquery stuff 

jQuery(document).ready(function() { 
<?php 
    if($this->logging == true) 
    { 
?> 
     function logFileClick(path) 
     { 
      jQuery.ajax({ 
        async: false, 
        type: "POST", 
        data: {log: path}, 
        contentType: "application/x-www-form-urlencoded; charset=UTF-8", 
        cache: false 
       }); 
     } 

     jQuery("a.file").click(function(){ 
      logFileClick("<?php print $this->location->getDir(true, true, false, 0);?>" + $(this).html()); 
      return true; 
     }); 
<?php 
    } 
    if(EncodeExplorer::getConfig("thumbnails") == true && $this->mobile == false) 
    { 
?> 
     function positionThumbnail(e) { 
      xOffset = 30; 
      yOffset = 10; 
      jQuery("#thumb").css("left",(e.clientX + xOffset) + "px"); 

      diff = 0; 
      if(e.clientY + $("#thumb").height() > $(window).height()) 
       diff = e.clientY + $("#thumb").height() - $(window).height(); 

      jQuery("#thumb").css("top",(e.pageY - yOffset - diff) + "px"); 
     } 

     jQuery("a.thumb").hover(function(e){ 
      jQuery("#thumb").remove(); 
      jQuery("body").append("<div id=\"thumb\"><img src=\"?thumb="+ $(this).attr("href") +"\" alt=\"Preview\" \/><\/div>"); 
      positionThumbnail(e); 
      jQuery("#thumb").fadeIn("medium"); 
     }, 
     function(){ 
      jQuery("#thumb").remove(); 
     }); 

     jQuery("a.thumb").mousemove(function(e){ 
      positionThumbnail(e); 
      }); 

     jQuery("a.thumb").click(function(e){$("#thumb").remove(); return true;}); 
<?php 
    } 
?> 
    }); 
//]]>     
</script> 
<?php 
} 
?> 
<title><?php if(EncodeExplorer::getConfig('main_title') != null) print EncodeExplorer::getConfig('main_title'); ?></title> 
</head>

来源

2011-07-21 nemmy

确实还有很多jQuery函数要与$ –

打电话。只要在'$（'）上做一个Ctrl + F，在未来的问题中，请不要像小孩子一样大叫大叫，只要聪明地问问题，你的问题（和标题）就已经过了消毒。 – BalusC

尝试

var j = jQuery.noConflict();

，然后在自己的呼叫到lib使用Ĵ而不是jQuery的。

您也可以封装所有的你自己的代码使用JQ这样的：

(function($){ 
    // all your jquery code, use $ without compunction!! 

}(jQuery);

来源

2011-07-21 16:57:16 brokenindexfinger

尝试......

如果您使用的Joomla的mootools将与jQuery的冲突。所以JQuery不会工作。

首先需要安装SC系统JQuery插件。

http://webappgenerator.com/releases/plg_system_scjquery

并对JQuery使用以下代码。

var j = jQuery.noConflict();

替换（JQuery的）关键词

则可以使用jQuery的$符号。

来源

2011-07-30 09:02:12

jQuery和Mootools冲突

回答

相关问题