原文出处:http://www.3gput.com/forum.php?mod=viewthread&tid=145
今天继续昨天的,在这里给大家介绍剩下的两种方法:
第一种,是通过返回字符串实现的,代码如下:
- san-area-html2.html
- <!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="Content-Type" content="text/html; charset=gb2312" />
- <title>省市县三级联动</title>
- </head>
- <body>
- <select id="sheng" onchange="getArea(this.value,'shi')" ></select> 省
- <select id="shi" onchange="getArea(this.value,'xian')" ></select> 市
- <select id="xian" ></select>
- </body>
- </html>
- <script language="javascript" type="text/javascript">
- function getArea(id,p){
- //初始化ajax
- var xhr = new XMLHttpRequest();
- var url = "./area-html2.php?id="+id+"r="+Math.random();
- var sel=document.getElementById(p)
- //打开请求
- xhr.open("get",url,true);
- //发送数据
- xhr.send(null);
- //等待响应
- xhr.onreadystatechange = function (){
- if(xhr.readyState == 4){
- var arr1=xhr.responseText.split(";");
- sel.length=0;
- for(var i=0;i<arr1.length;i++){
- var arr2=arr1[i].split(":");
- //产生一个option对象
- var opt=new Option(arr2[1],arr2[0]);
- //添加到当前列表当中
- sel.add(opt,null);
- }
- }
- }
- }
- //加载所有的省份
- getArea("",'sheng')
- </script>
- san-area-html2.php
- <?php
header("Content-Type:text/html;charset=UTF-8");
//连接数据库
sql_connect("localhost","root","") or die("数据库连接失败");
//选择连接的数据库
mysql_select_db("phpwork");
//设置编码
mysql_query("set names utf8");
//根据用户返回的ID查询
$id=$_GET['id'];
$sql="select id,name from area where id like '".$id."__'";
echo $sql;
$rs=mysql_query($sql);
//将查询的结果封装成html标记
echo ":";
while($rows=mysql_fetch_assoc($rs)){
echo ';'.$rows['id'].':'.$rows['name'];
} - ?>
第二种,是通过返回js对象实现,代码如下:
- area-json.html
- <!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="Content-Type" content="text/html; charset=gb2312" />
- <title>省市县三级联动</title>
- </head>
- <body>
- <select id="sheng" onchange="getArea(this.value,'shi')" ></select> 省
- <select id="shi" onchange="getArea(this.value,'xian')" ></select> 市
- <select id="xian" ></select>
- </body>
- </html>
- <script language="javascript" type="text/javascript">
- function getArea(id,p){
- //初始化ajax
- var xhr = new XMLHttpRequest();
- var url = "./area-json3.php?id="+id+"r="+Math.random();
- var sel=document.getElementById(p);
- //打开请求
- xhr.open("get",url,true);
- //发送数据
- xhr.send(null);
- //等待响应
- xhr.onreadystatechange = function (){
- if(xhr.readyState == 4){
- var jsonstr=xhr.responseText;
- //清空下拉菜单
- sel.length=0;
- var obj=eval("("+jsonstr+")")
- for(var i=0;i<obj.citys.length;i++){
- //产生一个option对象
- var opt=new Option(obj.citys[i].name,obj.citys[i].id);
- //添加到当前列表当中
- sel.add(opt,null);
- }
- }
- }
- }
- //加载所有的省份
- getArea("",'sheng')
- </script>
- area-json3.php
- <?php
- header("Content-Type:text/html;charset=UTF-8");
- //连接数据库
- include("../include/dbconn.php");
- //根据用户返回的ID查询
- $id=$_GET['id'];
- $sql="select id,name from area where id like '".$id."__'";
- $rs=mysql_query($sql);
- //定义一个数组用于存放数据库中查询到得每一条数据
- $arr =array();
- while($rows=mysql_fetch_assoc($rs)){
- //构建一个二维数组,每一个元素是一个对象(一条记录)$arr将构建str的[{"id":"11","name":"北京"},{"id":"13","name":"河北"}]部分
- $arr[]= $rows;
- }
- //重新产生新的数组构建 $arr将构建{"ctiys":[{"id":"11","name":"北京"},{"id":"13","name":"河北"}]}
- $arr2 = array('citys'=>$arr);
- echo json_encode($arr2);
- ?>
在这里简单的介绍一下JSON的概念:JSON概念很简单,JSON 是一种轻量级的数据格式,他基于 javascript 语法的子集,即数组和对象表示。由于使用的是 javascript 语法,因此JSON 定义可以包含在javascript 文件中,对其的访问无需通过基于 XML 的语言来额外解析。这两种没有浏览器的限制!要想更多的关于php,javascript,java,.net等等,请多多关注www.3gput.com!!!!