级联下拉

Ajax.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>
    <title>ajax demo</title>
<meta http-equiv = "content-type" content = "text/html; charset=utf-8" />
<script type="text/javascript">
var xmlhttp;
var province;
function createXMLHttpRequest()
{
//xmlhttp=null;
if (window.XMLHttpRequest)
{// code for all new browsers
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE5 and IE6
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
function change()
{
createXMLHttpRequest();
// province=document.getElementById("province").value;
provinces=document.getElementById("province");
province=provinces.options[provinces.selectedIndex].text;
alert(province);
if (xmlhttp!=null)
{
thedate = new Date();

var url = "menu.php?province="+ encodeURI(province) + "&tick=" + thedate.getMilliseconds() ;
xmlhttp.open("GET",url,true);
alert(url);
xmlhttp.onreadystatechange=state_Change;
xmlhttp.send(null);
}
else
{
alert("Your browser does not support XMLHTTP.");
}
}

function state_Change()
{
if (xmlhttp.readyState==4)
{
if (xmlhttp.status==200)
    {
    var result = xmlhttp.responseText;
alert("result:t"+result);
    result= result.split(",");
alert("result2222:t"+result);
    var list = document.all.city;
    list.options.length = 0;
    list.options.add(new Option("—请选择—", ""));
    for (var i = 0; i < result.length; i++) {
        list.options.add(new Option(result[i]));
    }
    }
else
    {
    alert("Problem retrieving XML data");
    }
}
}
</script>
</head>
<body>
    省份:
<select id="province" onchange="change();">
        <option selected="selected">河北</option>
        <option>北京</option>
        <option>山东</option>
    </select>
城市:
    <select id="city">
        <option selected="selected">邯郸</option>
    </select>

</body>
</html>

menu.php

<?php
//header("content = ‘text/html; charset=gb2312′");

$get=$_GET["province"];
if($get)
{
$out="";
switch($get)
{
   case "河北":
   $out="保定,石家庄,邢台";
   break;
   case "北京":
   $out="东城区,宣武区,朝阳区";
   break;
   case "山东":
   $out="济南,临沂";
   break;
}
//$out=iconv("utf-8","gb2312//IGNORE",$out);
echo $out;
}
?>

此条目发表在 Ajax 分类目录,贴了 , , 标签。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>