2个功能的JS起冲突

我找的导航和列表2个功能。
但是实现导航和列表这2个功能的他们自己的JS写的好像有冲突.我把导航的JS注释了列表就没问题,反之导航就出问题.
其中导航的JS是用的JQuery如下:(当然还有css不过它没问题,所以主要就是如下的js） <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="js/jquery.hoverIntent.minified.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            function megaHoverOver() {
                $(this).find(".sub").stop().fadeTo('fast', 1).show();                //Calculate width of all ul's
                (function($) {
                    jQuery.fn.calcSubWidth = function() {
                        rowWidth = 0;
                        //Calculate row
                        $(this).find("ul").each(function() {
                            rowWidth += $(this).width();
                        });
                    };
                })(jQuery);                if ($(this).find(".row").length > 0) { //If row exists...
                    var biggestRow = 0;
                    //Calculate each row
                    $(this).find(".row").each(function() {
                        $(this).calcSubWidth();
                        //Find biggest row
                        if (rowWidth > biggestRow) {
                            biggestRow = rowWidth;
                        }
                    });
                    //Set width
                    $(this).find(".sub").css({ 'width': biggestRow });
                    $(this).find(".row:last").css({ 'margin': '0' });                } else { //If row does not exist...                    $(this).calcSubWidth();
                    //Set Width
                    $(this).find(".sub").css({ 'width': rowWidth });                }
            }
            function megaHoverOut() {
                $(this).find(".sub").stop().fadeTo('fast', 0, function() {
                    $(this).hide();
                });
            }
            var config = {
                sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)    
                interval: 100, // number = milliseconds for onMouseOver polling interval    
                over: megaHoverOver, // function = onMouseOver callback (REQUIRED)    
                timeout: 500, // number = milliseconds delay before onMouseOut    
                out: megaHoverOut // function = onMouseOut callback (REQUIRED)    
            };            $("ul#topnav li .sub").css({ 'opacity': '0' });
            $("ul#topnav li").hoverIntent(config);        });
    </script>列表功能的JS不是用的JQuery,以下是列表功能的全部代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>点击弹出下拉列表效果，sky整理收集。</title>
<style type="text/css">
body{
 margin:10px;
 padding:10px;
}
body,td,div,span,li{
 font-size:12px;
}
.title01,.title02{
 color:#fff;
 font-weight:bold;
}
#DoorP{
 border:12px solid #eee;
 width:150px;
 height:300px;
 padding:4px;
 background:#fff;
}
.title01{
 width:100%;
 height:25px;
 background:#00ccff;
 cursor:pointer;
}
.title02{
 width:100%;
 height:25px;
 background:#99cc00;
 cursor:pointer;
}
.content{
 background:#eee;
 border-bottom:2px solid #fff;
 overflow:hidden;
 color:#666;
 padding-left:4px;
 padding-right:4px;
 line-height:18px;
}
</style>
<!--
棕：#eee;
蓝：#00ccff;
绿：#99cc00;
-->
</head>
<body><div id="DoorP">
 <table>
  <tr>
   <td>
    站长特效网
   </td>
  </tr>
 </table>
 <div class="content">
  zzjs  网页特效  广告代码 </div>
 <table>
  <tr>
   <td>
    第二层信息
   </td>
  </tr>
 </table>
 <div class="content">
  ThirdteenDevil
 </div>
 <table>
  <tr>
   <td>
    第三层信息
   </td>
  </tr>
 </table>
 <div class="content">
  devil13th
 </div>
</div>
<script type="text/javascript">
 var open = 2;// 设置初始打开的层序号
 var openState = new Array();
 var closeState = new Array();
 var dH = 220;
 function $(id){
  if(document.getElementById(id))
  {
   return document.getElementById(id);
  }
  else
  {
   alert("没有找到!");
  }
 }
 function $tag(id,tagName){
  return $(id).getElementsByTagName(tagName)
 }
 function closeMe(Cid,Oid){
  var h = parseInt(Ds[Cid].style.height);
  //alert(h);
  if(h > 0)
  {
   h = h - Math.ceil(h/3);
   Ds[Cid].style.height = h+"px";
  }
  else
  {
   openMe(Oid);
   clearTimeout(closeState[Cid]);
   return false;
  }
  closeState[Cid] = setTimeout("closeMe("+Cid+","+Oid+")");
 }
 function openMe(Oid){
  var h = parseInt(Ds[Oid].style.height);
  //alert(h);
  if(h < dH)
  {
   h = h + Math.ceil((dH-h)/3);
   Ds[Oid].style.height = h+"px";
  }
  else
  {
   clearTimeout(openState[Oid]);
   return false;
  }
  openState[Oid] = setTimeout("openMe("+Oid+")");
 }
 var Ds = $tag("DoorP","div");
 var Ts = $tag("DoorP","table");
 if(Ds.length != Ts.length)
 {
  alert("标题和内容数目不相同!");
 }
 for(var i = 0 ; i < Ds.length ; i++)
 {
  if(i==open)
  {
   Ds[i].style.height = dH+"px";
   Ts[i].className="title01";
  }
  else
  {
   Ds[i].style.height = "0px";
   Ts[i].className="title02";
  }
  Ts[i].value = i;
  Ts[i].onclick = function(){
   if(open==this.value)
   {
    return false;
   }
   Ts[open].className="title02";
   Ts[this.value].className="title01";
   for(var i = 0 ; i < openState.length ; i++)
   {
    clearTimeout(openState[i]);
    clearTimeout(closeState[i]);
   }
   closeMe(open,this.value);
   //openMe(this.value);
   open = this.value;
  }
 } 
 //直接打开层函数
 function showDiv(id){
  Ds[id].style.height=dH+"px";
  Ds[open].style.height="0px";
  open = id;
 }
</script>
</body>
</html>它两个我用浏览器调试JS的时候老是获取不到控件,JS也不熟所以不知道怎么改.请教各位大侠`

解决方案 »

  1.   

    列表的这部分给你改了一下，用这个：
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>点击弹出下拉列表效果，sky整理收集。</title>
    <style type="text/css">
    body{
     margin:10px;
     padding:10px;
    }
    body,td,div,span,li{
     font-size:12px;
    }
    .title01,.title02{
     color:#fff;
     font-weight:bold;
    }
    #DoorP{
     border:12px solid #eee;
     width:150px;
     height:300px;
     padding:4px;
     background:#fff;
    }
    .title01{
     width:100%;
     height:25px;
     background:#00ccff;
     cursor:pointer;
    }
    .title02{
     width:100%;
     height:25px;
     background:#99cc00;
     cursor:pointer;
    }
    .content{
     background:#eee;
     border-bottom:2px solid #fff;
     overflow:hidden;
     color:#666;
     padding-left:4px;
     padding-right:4px;
     line-height:18px;
    }
    </style>
    <!--
    棕：#eee;
    蓝：#00ccff;
    绿：#99cc00;
    -->
    </head>
    <body><div id="DoorP">
     <table>
      <tr>
       <td>
        站长特效网
       </td>
      </tr>
     </table>
     <div class="content">
      zzjs  网页特效  广告代码 </div>
     <table>
      <tr>
       <td>
        第二层信息
       </td>
      </tr>
     </table>
     <div class="content">
      ThirdteenDevil
     </div>
     <table>
      <tr>
       <td>
        第三层信息
       </td>
      </tr>
     </table>
     <div class="content">
      devil13th
     </div>
    </div>
    <script type="text/javascript">
     var open = 2;// 设置初始打开的层序号
     var openState = new Array();
     var closeState = new Array();
     var dH = 220;
     function $$(id){
      if(document.getElementById(id))
      {
       return document.getElementById(id);
      }
      else
      {
       alert("没有找到!");
      }
     }
     function $tag(id,tagName){
      return $$(id).getElementsByTagName(tagName)
     }
     function closeMe(Cid,Oid){
      var h = parseInt(Ds[Cid].style.height);
      //alert(h);
      if(h > 0)
      {
       h = h - Math.ceil(h/3);
       Ds[Cid].style.height = h+"px";
      }
      else
      {
       openMe(Oid);
       clearTimeout(closeState[Cid]);
       return false;
      }
      closeState[Cid] = setTimeout("closeMe("+Cid+","+Oid+")");
     }
     function openMe(Oid){
      var h = parseInt(Ds[Oid].style.height);
      //alert(h);
      if(h < dH)
      {
       h = h + Math.ceil((dH-h)/3);
       Ds[Oid].style.height = h+"px";
      }
      else
      {
       clearTimeout(openState[Oid]);
       return false;
      }
      openState[Oid] = setTimeout("openMe("+Oid+")");
     }
     var Ds = $tag("DoorP","div");
     var Ts = $tag("DoorP","table");
     if(Ds.length != Ts.length)
     {
      alert("标题和内容数目不相同!");
     }
     for(var i = 0 ; i < Ds.length ; i++)
     {
      if(i==open)
      {
       Ds[i].style.height = dH+"px";
       Ts[i].className="title01";
      }
      else
      {
       Ds[i].style.height = "0px";
       Ts[i].className="title02";
      }
      Ts[i].value = i;
      Ts[i].onclick = function(){
       if(open==this.value)
       {
        return false;
       }
       Ts[open].className="title02";
       Ts[this.value].className="title01";
       for(var i = 0 ; i < openState.length ; i++)
       {
        clearTimeout(openState[i]);
        clearTimeout(closeState[i]);
       }
       closeMe(open,this.value);
       //openMe(this.value);
       open = this.value;
      }
     } 
     //直接打开层函数
     function showDiv(id){
      Ds[id].style.height=dH+"px";
      Ds[open].style.height="0px";
      open = id;
     }
    </script>
    </body>
    </html>
      

  2.   

    是 function $(id){ 与 jQuery 中的冲突了。两个解决办法，一是将$ 方法改名，如楼上。二是使用 jQuery.noConflict();    让 jQuery 把$的控制权转移出来。用 jQuery  来代替 $
      

  3.   

    是的。说来我刚接触JQ时，却是马上就看到JQ冲突时应如何处理。
    也许这就是经验的差别。一般的人，只去看它能做的很多细节上的事，而不注意这个东西在整个运用上的注意事项。
    我想对楼主来说，前一种方法比较容易接受和运用，改动量也少，因为下面JQ的$使用数量也不少。
      

  4.   

    JQuery的冲突吧。jquery
    可以自定义。
      

  5.   

    jquery有冲突的时候的解决办法，楼主可以自己查一下
      

  6.   

    http://jquery-api-zh-cn.googlecode.com/svn/trunk/xml/jqueryapi.xml
    建议先把文档看一遍吧，这样遇到问题的时候大概就知道该怎么办了
      

  7.   

    你是怎么解决的啊，能给我发一个邮件吗？[email protected]