显示子类别，当点击主类别，并显示产品时，点击亚猫与阿贾克斯

Question

我正在一个模块，其中我有侧栏中的ul的主要类别，我有一个下拉的子类别。这个想法是，当我点击主要类别中的任何链接时，它应该在下拉菜单中显示相关的子类别，当我点击子类别时，它应该在列表视图中显示下面的产品详细信息。我做了所有这些，但现在寻找阿贾克斯为我做这个。

我搜索了它，但主要是我发现下拉为主要和子类别，但我不需要下拉为主要类别。给我一个例子或任何有这一切的链接休息我会做我的家庭作业。

所有记录都是从数据库中取出三个通过FK链接的表。

在此先感谢您提供任何帮助。

<div id="main-cat"> 
    <ul> 
     <li></li> 
     <li></li> 
     <li></li>   
    </ul> 
</div> 

<div id="sub-cat"> 
    <select> 
    <option></option> 
    <option></option> 
    <option></option> 
    </select> 

    <div id="products"> 
    <ul> 
     <li></li> 
     <li></li> 
     <li></li> 
    </ul> 

现在我想做的是当网页加载它显示出与主要类别北京时间DIV，当我点击任何主要猫它更新降子猫因此与阿贾克斯的下来，然后SUBCAT负载时，我点击任何子猫都会用ajax加载第三个div。

希望它现在会有所帮助

Answer 1

我没有得到它，为什么使用Ajax的下拉菜单？

总之在这里你去

<div class="menuHolder" id="menuHolder"> 
     <script type="text/javascript"> 
      loadMenu(); 
     </script> 
</div> 

的Ajax功能（.js文件）

function loadMenu(ANY VALUES HERE) { 
    xmlhttp=new XMLHttpRequest(); 
    xmlhttp.open("GET","/ajax.php?page=menu&key="+value,true); 
    xmlhttp.send(null); 

    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById("menuHolder").innerHTML= xmlhttp.responseText; 
       /* returns the HTML from the Ajax page into menuHolder div */ 
     } 
    } 
} 

Ajax.php这个地方在服务器

$file = $_GET['page']; 

if(file_exists('yourpath/ajax/'.$file.'.php')){ 
    include_once 'yourpath/ajax/'.$file.'.php'; 
} else { 
    print 'File could not be found'; 
} 

阿贾克斯文件的根目录： menu.php，所有html将返回给定容器

Your code, Values passed with Ajax can be received with $_GET['key'] 
<div class="menu" id="menu"> 
     /* code for menu */ 
</div> 
<? 
if(isset($_GET['submenu']) { /* if you passed a value for submenu with ajax */ 
    ?> 
    <div class="submenu" id="menu"> 
     /* code for submenu */ 
    </div> 
    <? 
} 
?> 
....... 

正如你看到我不喜欢的JQuery很多，我总是用普通的JavaScript，希望那不是一个问题