码迷,mamicode.com
首页 > Web开发 > 详细

一个ajax实例

时间:2016-03-13 17:48:23      阅读:131      评论:0      收藏:0      [点我收藏+]

标签:

一个ajax实例

 
html
 
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="renderer" content="webkit">
  6. <!--360,以webkit内核进行渲染-->
  7. <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  8. <!--以最新内核进行渲染。-->
  9. <meta http-equiv="Cache-Control" content="no-siteapp"/>
  10. <!--百度禁止转码-->
  11. <title>moyu demo</title>
  12. <meta name="keywords" content="demo 测试 魔芋">
  13. <meta name="description" content="魔芋的测试示例">
  14. <meta name="author" content="魔芋,15000720652@163.com,http://www.cnblogs.com/moyuling/">
  15. <meta name="robots" content="index,follow">
  16. <!--定义网页搜索引擎索引方式-->
  17. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  18. <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
  19. <style>
  20. </style>
  21. </head>
  22. <body>
  23. <script>
  24. function showUser(str){
  25. if(str ==""){
  26. document.getElementById("txtHint").innerHTML ="";
  27. return;
  28. }
  29. if(window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
  30. xmlhttp =newXMLHttpRequest();
  31. }else{// code for IE6, IE5
  32. xmlhttp =newActiveXObject("Microsoft.XMLHTTP");
  33. }
  34. xmlhttp.onreadystatechange =function(){
  35. if(xmlhttp.readyState ==4&& xmlhttp.status ==200){
  36. document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  37. }
  38. }
  39. xmlhttp.open("GET","http://localhost/moyu.php?q="+ str,true);
  40. xmlhttp.send();
  41. }
  42. </script>
  43. </head>
  44. <body>
  45. <form>
  46. <select name="users" onchange="showUser(this.value)">
  47. <option value="">Select a person:</option>
  48. <option value="1">PeterGriffin</option>
  49. <option value="2">LoisGriffin</option>
  50. <option value="3">GlennQuagmire</option>
  51. <option value="4">JosephSwanson</option>
  52. </select>
  53. </form>
  54. <br>
  55. <div id="txtHint"><b>Person info will be listed here.</b></div>
  56. </body>
  57. </html>
 
 
php
 
 
  1. <?php
  2. $q=$_GET["q"];
  3. echo "$q";
  4. ?>
 
 
 
魔芋测试:
技术分享
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

 



 

一个ajax实例

标签:

原文地址:http://www.cnblogs.com/moyuling/p/5272506.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!