ajax php mysql无限级联菜单 联动菜单 二级联动 三级联动菜单

小雪崩

ajax php mysql无限级联菜单 联动菜单 二级联动 三级联动菜单
无限级联菜单 联动菜单 二级联动 三级联动菜单
有几个级别的菜单就显示级别
本例是《ajax php 动态读取的级联菜单 联动菜单》的扩展，由二级联动扩展到无限级


演示
　　
 
XML/HTML Code

• <div id="show_sub_categories">  
  
•         <select name="search_category" class="parent">  
  
•         <option value="" selected="selected">-- Categories --</option>  
  
•         <?php  
  
•         $query = "select * from ajax_categories where pid = 0";  
  
•         $results = mysql_query($query);  
  
•           
  
•         while ($rows = mysql_fetch_assoc(@$results))  
  
•         {?>  
  
•             <option value="<?php echo $rows['id'];?>"><?php echo $rows['category'];?></option>  
  
•         <?php  
  
•         }?>  
  
•         </select>     
  
•           
  
•     </div>  
  

 
JavaScript Code

• <script type="text/javascript">  
  
•   
  
• $(document).ready(function() {  
  
•       
  
•     //$('#loader').hide();  
  
•       
  
•     $('.parent').livequery('change', function() {  
  
•           
  
•         $(this).nextAll('.parent').remove();  
  
•         $(this).nextAll('label').remove();  
  
•           
  
•         $('#show_sub_categories').append('<img src="loader.gif" style="float:left; margin-top:7px;" id="loader" alt="" />');  
  
•           
  
•         $.post("get_chid_categories.php", {  
  
•             parent_id: $(this).val(),  
  
•         }, function(response){  
  
•               
  
•             setTimeout("finishAjax('show_sub_categories', '"+escape(response)+"')", 400);  
  
•         });  
  
•           
  
•         return false;  
  
•     });  
  
• });  
  
•   
  
• function finishAjax(id, response){  
  
•   $('#loader').remove();  
  
•   
  
•   $('#'+id).append(unescape(response));  
  
• }   
  
•   
  
• </script>  
  

 
　　
原文地址:http://www.freejs.net/article_biaodan_290.html