javascript没有'我不在Joomla 3上工作

javascript doesn't work on Joomla 3

本文关键字:Joomla 工作 没有 javascript      更新时间:2023-09-26

我总是直接使用jquery脚本来处理joomla的模块。

最近,我从使用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中不起作用。

知道吗?

Mootools默认加载在Joomla中!2.5.x。这是另一个类似jQuery的JS库,它们也使用$symbol。所以我们需要使用jQuery.noConflict()方法来解决这个问题。

尝试以这种方式使用jQuery并重新检查。

  var $jQ = jQuery.noConflict();
  // $jQ is now an alias to the jQuery function
  // creating the new alias is optional.
  $jQ(document).ready(function() {
   $jQ( "div" ).hide();
  });

我在这里重写了你的代码:

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