php+js实现省市[select下拉列表]二级关联菜单效果

<head>
<meta http-equiv="Content-Type" ontent="text/html; charset=gb2312" />
<title>表单元素[select下拉列表]制作二级联动菜单</title>
<?php
$link = mysql_connect('localhost','root','root') or die( mysql_error());
  mysql_select_db('cshouse',$link) or die('db error');
  mysql_query("set Names'gbk'");
  /*$sql = "Select * from zgy_classplace where upid=0 order by id asc";
  $result = mysql_query( $sql );
  $i =1;
  $count = mysql_num_rows( $result );
  $b=',';
  while( $rs = mysql_fetch_array( $result  ) )
  {
   if( $i==$count ){ $b =''; }
   echo " new Array("$rs[id]","$rs[cntitle]")$b nt";
   $i++;
  }
  echo ");";
  */
  
  ?>
<script language="javascript">
//下面函数是演示二,联动菜单的处理代码
function makeplace_a(x){
    var form2=document.wane_search.one.options.length;//这句解释同上
    var wane_searchl=new Array(form2)//新建一个数组,项数为第一个下拉列表的项数
    for(i=0;i<form2;i++)//循环第一个下拉列表的项数那么多次
        wane_searchl[i]=new Array();//子循环
        //下面是给每个循环赋值 
    var place_a=document.wane_search.place_a;//方便引用

 <?php
  $sql = "Select * from zgy_classplace where upid=0 ";
  $result = mysql_query( $sql );
  $j =1;
  while( $rs = mysql_fetch_array( $result ) )
  {
   
   $sql = mysql_query("Select * from zgy_classplace where upid='$rs[id]' and upid<>0") ;
   $i =0;
  
   while( $p =mysql_fetch_array( $sql ) )   {
    
     echo "wane_searchl[$j][$i] = new Option("$p[cntitle]","$p[id]"); nt";
     $i++;
     
    
   }
   $j++;
  }
 ?>
    for(m=place_a.options.length-1;m>0;m--)
    //这个要看清楚,因为要重新填充下拉列表的话必须先清除里面原有的项,清除和增加当然是有区别的了,所以用递减
        place_a.options[m]=null;//将该项设置为空,也就等于清除了
    for(j=0;j<wane_searchl[x].length;j++){//这个循环是填充下拉列表
        place_a.options[j]=new Option(wane_searchl[x][j].text,wane_searchl[x][j].value)
        //注意上面这据,列表的当前项等于 新项(数组对象的x,j项的文本为文本,)
    }
    place_a.options[0].selected=true;//设置被选中的初始值
}
</script>
</head>
<body>
<form id="form20" name="wane_search" method="post" action="">
  <select name="one" size="1" onchange="makeplace_a(options.selectedIndex)">
  <option value="">---请选择省份---</option>
  <?php
    $sql_pr = "Select * from zgy_classplace where upid=0";
  $result_pr = mysql_query( $sql_pr );
  while( $rs_pr = mysql_fetch_array( $result_pr ) )
  {
   echo "<option value=$rs_pr[id]>$rs_pr[cntitle]</option> nt";
  }
  ?>  
  </select>
  <select name="place_a">
  <option value="">---请选择城市---</option>
   
  </select>
  <label>
  <input type="submit" name="Submit" value="提交">
  </label>
</form>
<?php
if($_POST)
{
 print_r($_POST);
}

?>
</body>
</html>

 

时间: 2024-10-06 15:47:54

php+js实现省市[select下拉列表]二级关联菜单效果的相关文章

js下拉框二级关联菜单效果代码具体实现

这篇文章介绍了js下拉框二级关联菜单效果代码具体实现,有需要的朋友可以参考一下   复制代码 代码如下:  <!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&quo

js实现的黑背景灰色二级导航菜单效果代码_jquery

本文实例讲述了js实现的黑背景灰色二级导航菜单效果代码.分享给大家供大家参考.具体如下: 这是一款js实现的黑背景灰色二级导航菜单,兼容IE6.firefox的js+css横向二极导航菜单.挺简洁,不过很清新,二级菜单是水平显示在主菜单的下方,采用流行的微软雅黑字体,若不想用这种字体,可换成默认的宋体即可. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-black-bgcolor-2level-nav-style-codes/ 具体代码如

JS实现黑色大气的二级导航菜单效果_javascript技巧

本文实例讲述了JS实现黑色大气的二级导航菜单效果.分享给大家供大家参考.具体如下: 这是一款自己做的不错的二级导航菜单,黑色风格,是根据仿淘宝支付宝菜单而做的,自我感觉还算行吧. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-black-style-2l-nav-menu-codes/ 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

js下拉框二级关联菜单效果代码

 <!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>  <meta http-equiv="Cont

js下拉框二级关联菜单效果代码具体实现_javascript技巧

复制代码 代码如下:  <!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> <meta http-equiv=&q

JS实现的Select三级下拉菜单代码_javascript技巧

本文实例讲述了JS实现的Select三级下拉菜单.分享给大家供大家参考.具体如下: 这里使用js实现Select三级下拉菜单,比如全国省市城市选择.数码类产品分类.人才类别选择等,都比较具有代表性,在表单中容易使用Select下拉列表菜单供用户选择,当然,自己用还是需要稍微改动的,比如至少菜单内容要改成自己需要的,其它的好说. 运行效果如下图所示: 在线演示地址如下: http://demo.jb51.net/js/2015/js-3-select-menu-codes/ 具体代码如下: <ht

js自动查找select下拉的菜单并选择

 这篇文章主要介绍了js自动查找select下拉的菜单并选择(示例代码)需要的朋友可以过来参考下,希望对大家有所帮助  代码如下: function find_select(name) {  var select = document.getElementsByName(name);  var find_str = document.getElementById('to_find_str').value;  if(select)  {   select = select[0];   var ch

java实现的二级联动菜单效果_java

本文实例讲述了java实现的二级联动菜单效果.分享给大家供大家参考,具体如下: JSP代码: <%@ page language="java" pageEncoding="UTF-8"%> <html> <head> <title>二级菜单联动演示</title> <script type="text/javascript"> var req; window.onload=f

基于Javascript实现二级联动菜单效果_javascript技巧

本文实例为大家分享了Javascript实现二级联动菜单效果的对应代码,具体内容如下 效果图如下: 具体实现步骤如下: 1.所用js代码如下: <script type="text/javascript"> var arr_province=["请选择省份/城市","北京市","上海市","天津市","河南省","山东省","河北省"]