|
1,province.php
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>select province and city - www.jbxue.com</title>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
function getCity(){
var http_request=createAjax();
var url="/ajax/province_do.php";
var data="province="+$("province").value;
http_request.onreadystatechange=process;
http_request.open("post",url,true);
http_request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
http_request.send(data);
function process(){
if(http_request.readyState==4 && http_request.status==200){
var city=http_request.responseXML.getElementsByTagName("city");
$("city").length=0;
var myoption=document.createElement("option");
myoption.innerText="---市---";
$("city").appendChild(myoption);
for(var i=0;i<city.length;i++){
var cityList=city.childNodes[0].nodeValue;
var myoption=document.createElement("option");
myoption.value=cityList;
myoption.innerText=cityList;
$("city").appendChild(myoption)
}
}
}
}
</script>
</head>
<body>
<form>
<select id="province" onchange="getCity();">
<option value="">---省---</option>
<option value="zhejiang">浙江</option>
<option value="shaanxi">陕西</option>
</select>
<select id="city">
<option value="">---市---</option>
</select>
<select id="country">
<option value="">---县---</option>
</select>
</form>
</body>
</html>
province_do.php
<?php
header("Content-Type:text/xml;charset=utf-8");
header("Cache-Control:no-cache");
$province=$_POST['province'];
$cityinfo="";
if ($province=="zhejiang"){
$cityinfo="<province><city>杭州</city><city>金华</city><city>台州</city></province>"; // www.jbxue.com
}elseif ($province=="shaanxi"){
$cityinfo="<province><city>汉中</city><city>安康</city><city>商洛</city></province>";
}
echo $cityinfo;
?> |
|
|