手机
当前位置:查字典教程网 >编程开发 >AJAX相关 >AJAX 二级级联菜单实现代码
AJAX 二级级联菜单实现代码
摘要:客户端代码:复制代码代码如下:无标题文档varxmlHttp;vara=newArray();functioncreateXMLHttpRe...

客户端代码:

复制代码 代码如下:

<!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;

?>

【AJAX 二级级联菜单实现代码】相关文章:

javascript Ajax 类实现代码

ajax实例入门代码

AJAX 进度条实现代码

AJAX 用户唯一性验证实现代码

ajax+asp无限级分类树型结构的代码

AJAX实现瀑布流布局

基于 Ajax 的无限级菜单

基于AJAX的分页类实现代码

Ajax读取数据之分页显示篇实现代码

AJAX防止页面缓存的代码

精品推荐
分类导航