设为首页收藏本站新闻投稿

MOD中国同盟社

 找回密码
 注册

QQ登录

只需一步,快速开始

搜索
查看: 754|回复: 3

[教程] php+ajax动态生成下拉菜单 [复制链接]

Rank: 20Rank: 20Rank: 20Rank: 20Rank: 20

帖子
2836
精华
2
声望
12984 点
金币
2999 Mold
被赞许
28 次
注册时间
2006-4-28

Mod中国同盟社至高荣誉

发表于 2010-8-25 16:05:24 |显示全部楼层
  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4. <title>无标题文档</title>
  5. <script language="javascript">
  6. //var ab = new Array();
  7. var xmlHttp;

  8. function createXMLHttpRequest() {
  9.     if (window.ActiveXObject) {
  10.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  11.     }  
  12.     else if (window.XMLHttpRequest) {
  13.         xmlHttp = new XMLHttpRequest();
  14.     }
  15. }
  16.      
  17. function startRequest() {
  18.     createXMLHttpRequest();
  19.     xmlHttp.onreadystatechange = handleStateChange;
  20.     document.getElementById('select2').options.length = 0;
  21.     var url = document.form1.select1.value;
  22.     var qurl = "getCities.php?countryCode="+url+"&time="+new Date().getTime();
  23.     xmlHttp.open("GET", qurl, true);
  24.     xmlHttp.send(null);
  25.     //setTimeout("startRequest()",2000);
  26. }
  27.      
  28. function handleStateChange() {
  29.     if(xmlHttp.readyState == 4) {
  30.         if(xmlHttp.status == 200) {
  31.         var obj = document.getElementById('select2');
  32.             eval(xmlHttp.responseText);
  33.             
  34.         }
  35.     }
  36. }

  37. </script>
  38. </head>

  39. <body>
  40. <form name="form1" method="post" action="">
  41.   <p>
  42.     <select name="select1" id="select1" onChange="startRequest()">
  43.       <option value="0">选择</option>
  44.       <option value="no">1</option>
  45.       <option value="dk">2</option>
  46.       <option value="us">3</option>
  47.     </select>
  48. </p>
  49.   <p>
  50.     <select name="select2" id="select2">
  51.     </select>
  52. </p>
  53. </form>
  54. </body>
  55. </html>  
复制代码
getCities.php
  1. <?php

  2. if(isset($_GET['countryCode'])){
  3.    
  4.   switch($_GET['countryCode']){
  5.      
  6.     case "no":
  7.       echo "obj.options[obj.options.length] = new Option('Bergen','1');n";
  8.       echo "obj.options[obj.options.length] = new Option('Haugesund','2');n";
  9.       echo "obj.options[obj.options.length] = new Option('Oslo','3');n";
  10.       echo "obj.options[obj.options.length] = new Option('Stavanger','4');n";
  11.       
  12.       break;
  13.     case "dk":
  14.       
  15.       echo "obj.options[obj.options.length] = new Option('Aalborg','11');n";
  16.       echo "obj.options[obj.options.length] = new Option('Copenhagen','12');n";
  17.       echo "obj.options[obj.options.length] = new Option('Odense','13');n";
  18.       
  19.       break;
  20.     case "us":
  21.       
  22.       echo "obj.options[obj.options.length] = new Option('Atlanta','21');n";
  23.       echo "obj.options[obj.options.length] = new Option('Chicago','22');n";
  24.       echo "obj.options[obj.options.length] = new Option('Denver','23');n";
  25.       echo "obj.options[obj.options.length] = new Option('Los Angeles','24');n";
  26.       echo "obj.options[obj.options.length] = new Option('New York','25');n";
  27.       echo "obj.options[obj.options.length] = new Option('San Fransisco','26');n";
  28.       echo "obj.options[obj.options.length] = new Option('Seattle','27');n";
  29.       
  30.       break;
  31.   }   
  32. }
  33. ?>  
复制代码
已有 1 人评分声望 收起 理由
无语。。A + 12

总评分: 声望 + 12   查看全部评分

使用道具 举报

Rank: 5Rank: 5

帖子
992
精华
0
声望
1428 点
金币
211 Mold
被赞许
0 次
注册时间
2009-8-15
发表于 2010-8-25 17:29:04 |显示全部楼层
什么啊!?一个解释也没有!天书!?

使用道具 举报

Rank: 20Rank: 20Rank: 20Rank: 20Rank: 20

帖子
2836
精华
2
声望
12984 点
金币
2999 Mold
被赞许
28 次
注册时间
2006-4-28

Mod中国同盟社至高荣誉

发表于 2010-8-25 18:15:48 |显示全部楼层
回复 2# xiongyang


    这个是实例,复制下来直接就有效果。

使用道具 举报

Rank: 3Rank: 3

帖子
55
精华
0
声望
589 点
金币
69 Mold
被赞许
0 次
注册时间
2011-5-15

黑暗使者

发表于 2011-11-11 19:57:38 |显示全部楼层
不错 lz学网站开发的?

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

回顶部