博客
关于我
php jquery ajax 多级联动菜单
阅读量:269 次
发布时间:2019-03-01

本文共 4072 字,大约阅读时间需要 13 分钟。

目前只做了三级,要四、五级的,要自己修改


index.php代码

<?php include("sunland_config.php");?><!DOCTYPE html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css"><script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script><script src="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script><title>AJAX Demo</title> <script>       // setTimeout('showLoader()', 100);//这里要延迟一下,直接调用无法显示加载器      //显示加载器.for jQuery Mobile 1.2.0            function showLoader() {            $.mobile.loading('show', {                text: '正在加载中...', //加载器中显示的文字                  textVisible: true, //是否显示文字                  theme: 'a',        //加载器主题样式a-e                  textonly: false,   //是否只显示文字                  html: ""           //要显示的html内容,如图片等              });        }		//隐藏加载器.for jQuery Mobile 1.2.0  		function hideLoader() {			$.mobile.loading('hide');		}</script></head><body><script type="text/javascript">  $(document).ready(function()  {           		//$('#loader').hide();  		//$('#loader3').hide();  		hideLoader();		 		 //一级改变事件,把一级ID传递给PHP文件,返回二级内容 //flid=3 三级		$(".country").change(function()  {  			var id=$(this).val();  			var dataString = 'flid=2&id='+ id ; //flid=2 二级			//$('#loader').show();  //显示数据加载中.... 			showLoader();  //显示数据加载中....				$.ajax ({  					type: "POST",  					url: "04.php",  					data: dataString,  					cache: false,  					success: function(html)  {  					   $("#city").html(html); 					   hideLoader(); 					   //$('#loader').hide();  					   }   				});  		  		}); 				//二级改变事件,把二级ID传递给PHP文件,返回三级内容 //flid=3 三级		$(".city").change(function()  {  			var id=$(this).val();  			 //alert("HTML: " + id2);			var dataString = 'flid=3&id='+ id ;  //flid=3 三级			 //alert("HTML: " + dataString);			 //$('#loader3').show();  //显示数据加载中.... 			 showLoader();  //显示数据加载中....				$.ajax ({  					type: "POST",  					url: "04.php",  					data: dataString,  					cache: false,  					success: function(html)  {  					   $("#city3").html(html); 					   hideLoader(); 					   //$('#loader3').hide();     					   }   				});  		  		}); });  </script>  <div style="margin:20px">  <label>一类:</label> <select name="country" class="country">  <option selected="selected">--Select--</option>  <?php   $sql=mysql_query("select id,title from data_type_dqs where flid = 1");  while($row=mysql_fetch_array($sql))  {  $id=$row['id'];  $data=$row['title'];  echo '<option value="'.$id.'">'.$data.'</option>';   } ?>  </select> <label>二类 :</label>            <!--<img src="images/loader.gif" style="margin-top:8px; float:left" id="loader" alt="正在加载中.." /> -->        <select name="city" id="city" class="city">           <option selected="selected">--Select--</option>        </select></div><label>3类 :</label>           <!--<img src="images/loader.gif" style="margin-top:8px; float:left" id="loader3" alt="正在加载中.." /> -->        <select name="city3" id="city3" class="city3">           <option selected="selected">--Select--</option>        </select></div></body></html>


04.php代码

<?php  include("sunland_config.php");if($_POST['id'])  {  $id=$_POST['id']; $flid=$_POST['flid'];  	  if($_POST['flid']==2)  { //返回二级选择			  $sql=mysql_query("select id,title from data_type_dqs where pid='$id' and flid = '$flid'");  			  while($row=mysql_fetch_array($sql))  			  {  			  $id=$row['id'];  			  $data=$row['title'];  					$tt .='<option value="'.$id.'">'.$data.'</option>';    				}				echo "<option value=>请选择</option>".$tt;  	  }			if($_POST['flid']==3)  { //返回3级选择 			$id=$_POST['id']; 			$flid=$_POST['flid'];  			$sql=mysql_query("select id,title from data_type_dqs where pid2='$id'"); 			$num_rows = mysql_num_rows($sql);			if ($num_rows!=0){ 				while($row=mysql_fetch_array($sql))  {  					$id=$row['id'];  					$data=$row['title'];  										$tt .='<option value="'.$id.'">'.$data.'</option>';    				}				echo "<option value=>请选择</option>".$tt;			}else{				   echo "";				}		  	}  }    ?>  



转载地址:http://gbcx.baihongyu.com/

你可能感兴趣的文章
multiprocessing.pool.map 和带有两个参数的函数
查看>>
MYSQL CONCAT函数
查看>>
multiprocessing.Pool:map_async 和 imap 有什么区别?
查看>>
MySQL Connector/Net 句柄泄露
查看>>
multiprocessor(中)
查看>>
mysql CPU使用率过高的一次处理经历
查看>>
Multisim中555定时器使用技巧
查看>>
MySQL CRUD 数据表基础操作实战
查看>>
multisim变压器反馈式_穿过隔离栅供电:认识隔离式直流/ 直流偏置电源
查看>>
mysql csv import meets charset
查看>>
multivariate_normal TypeError: ufunc ‘add‘ output (typecode ‘O‘) could not be coerced to provided……
查看>>
MySQL DBA 数据库优化策略
查看>>
multi_index_container
查看>>
MySQL DBA 进阶知识详解
查看>>
Mura CMS processAsyncObject SQL注入漏洞复现(CVE-2024-32640)
查看>>
Mysql DBA 高级运维学习之路-DQL语句之select知识讲解
查看>>
mysql deadlock found when trying to get lock暴力解决
查看>>
MuseTalk如何生成高质量视频(使用技巧)
查看>>
mutiplemap 总结
查看>>
MySQL DELETE 表别名问题
查看>>