Joomla 3에서 javascript가 작동하지 않습니다.

Question

저는 항상 joomla의 모듈에 jquery 스크립트를 직접 사용합니다.

요즘 Joomla2에서 Joomla3으로 전환했습니다. 여하튼 스크립트는 모듈에서 더 이상 작동하지 않습니다. 왜 그런지 압니까?

는

예 (일부 스크립트는 여전히하지만 작동) : 이 내가 일하고 것입니다.

<a href="#intro">Intro</a> <a href="#about">About</a> <a href="#info">Info</a> 
<h1 id="intro">Intro</h1> 
<p>abcd</p> 
<h1 id="about">About</h1> 
<p>xxxxxxxxxx</p> 
<p>xxxxxxxxxx</p> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
var jump=function(e) 
{ 
     //prevent the "normal" behaviour which would be a "hard" jump 
     e.preventDefault(); 
     //Get the target 
     var target = $(this).attr("href"); 
     //perform animated scrolling 
     $('html,body').animate(
     { 
       //get top-position of target-element and set it as scroll target 
       scrollTop: $(target).offset().top 
     //scrolldelay: 2 seconds 
     },600,function() 
     { 
       //attach the hash (#jumptarget) to the pageurl 
       location.hash = target; 
     }); 

} 

$(document).ready(function() 
{ 
     $('a[href*=#]').bind("click", jump); 
     return false; 
}); 
</script> 

코드는 대상 메뉴 ID에서 부드러운 스크롤을 제공합니다. 위의 코드를 Joomla2 모듈에서 사용하면 훌륭하게 작동하지만 Joomla 3에서는 작동하지 않습니다.

아이디어가 있으십니까?

Answer 1

기본적으로 Joomla!에서 Mootools가로드됩니다. 2.5.x. jQuery와 같은 또 다른 JS 라이브러리이며 $ symbol을 사용합니다. 그래서 우리는 jQuery.noConflict() 메소드를 사용하여이 문제를 해결해야한다.

이렇게하면 jQuery를 사용하여 다시 확인하십시오.

<script type="text/javascript"> 
var jump=function(e) 
{ 
     //prevent the "normal" behaviour which would be a "hard" jump 
     e.preventDefault(); 
     //Get the target 
     var target = $jQ(this).attr("href"); 
     //perform animated scrolling 
     $jQ('html,body').animate(
     { 
       //get top-position of target-element and set it as scroll target 
       scrollTop: $jQ(target).offset().top 
     //scrolldelay: 2 seconds 
     },600,function() 
     { 
       //attach the hash (#jumptarget) to the pageurl 
       location.hash = target; 
     }); 

} 

var $jQ = jQuery.noConflict(); 

$jQ(document).ready(function() 
{ 
     $jQ('a[href*=#]').bind("click", jump); 
     return false; 
}); 
</script>