当前位置: 移动技术网 > IT编程>脚本编程>Ajax > AJAX 二级级联菜单实现代码

AJAX 二级级联菜单实现代码

2017年12月12日  | 移动技术网IT编程  | 我要评论
客户端代码:
复制代码 代码如下:

<!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>
<script type="text/javascript">
var xmlhttp;
var a =new array();
function createxmlhttprequest(){
if(window.activexobject){
xmlhttp=new activexobject("microsoft.xmlhttp");
}
else if(window.xmlhttprequest){
xmlhttp=new xmlhttprequest();
}
}
function send_request(){
createxmlhttprequest();
var year = document.getelementbyid("year");
var url = "check_2.php?page="+escape(year.value);
xmlhttp.open("get",url,true);
xmlhttp.onreadystatechange = checkit;
xmlhttp.send(null);
}
function checkit(){
if(xmlhttp.readystate == 4){
if(xmlhttp.status == 200){
showchild();
}
}
}
function showchild(){
var xmldoc=xmlhttp.responsexml;
var content=xmldoc.getelementsbytagname("city");
for(var i=0;i<content.length;i++){
var y=content[i];
a[i]=y.childnodes[0].data;
}
show1();
}
function show1(){
var obj=document.getelementbyid("name");
var number=obj.length;
for(var j=obj.length-1;j>=0;j--){
obj.removechild(obj.childnodes.item(j));
}
for(var i=0;i<a.length;i++){
var opt=document.createelement("option");
opt.text=a[i];
obj.add(opt);
}
}
</script>
<body>
年份:<select id="year" onchange="send_request()">
<option value="0">请选择</option>
<option value="1">1996-2006</option>
<option value="2">1986-1995</option>
<option value="3">1971-1985</option>
<option value="4">1970以前</option>
</select>
子目录:<select id="name">
<option value="0">请选择</option>
</select>
</body>
</html>

服务器端代码:
复制代码 代码如下:

<?php
header('content-type: text/xml');
$xml="<?xml version='1.0' encoding='gb2312'?>";
$year = $_get["page"];
$content = $xml."<contents>";
if($year == "1"){
$content = $content."<city>1</city><city>11</city></contents>";
}
else if($year == '2'){
$content = $content."<city>2</city><city>12</city></contents>";
}
else if($year == '3'){
$content = $content."<city>3</city><city>13</city></contents>";
}
else if($year == '4'){
$content = $content."<city>4</city><city>14</city></contents>";
}
echo $content;
?>

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网