Fork me on GitHub
魔芋铃
Menu

一个ajax实例

一个ajax实例

 
html
 
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  4. <head>
  5. <meta charset="utf-8">
  6. <meta name="renderer" content="webkit">
  7. <!--360,以webkit内核进行渲染-->
  8. <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  9. <!--以最新内核进行渲染。-->
  10. <meta http-equiv="Cache-Control" content="no-siteapp"/>
  11. <!--百度禁止转码-->
  12. <title>moyu demo</title>
  13. <meta name="keywords" content="demo 测试 魔芋">
  14. <meta name="description" content="魔芋的测试示例">
  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>
  21. </style>
  22. </head>
  24. <body>
  25. <script>
  26. function showUser(str){
  27. if(str ==""){
  28. document.getElementById("txtHint").innerHTML ="";
  29. return;
  30. }
  31. if(window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
  32. xmlhttp =newXMLHttpRequest();
  33. }else{// code for IE6, IE5
  34. xmlhttp =newActiveXObject("Microsoft.XMLHTTP");
  35. }
  36. xmlhttp.onreadystatechange =function(){
  37. if(xmlhttp.readyState ==4&& xmlhttp.status ==200){
  38. document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  39. }
  40. }
  41. xmlhttp.open("GET","http://localhost/moyu.php?q="+ str,true);
  42. xmlhttp.send();
  43. }
  44. </script>
  45. </head>
  47. <body>
  48. <form>
  49. <select name="users" onchange="showUser(this.value)">
  50. <option value="">Select a person:</option>
  51. <option value="1">PeterGriffin</option>
  52. <option value="2">LoisGriffin</option>
  53. <option value="3">GlennQuagmire</option>
  54. <option value="4">JosephSwanson</option>
  55. </select>
  56. </form>
  57. <br>
  58. <div id="txtHint"><b>Person info will be listed here.</b></div>
  59. </body>
  61. </html>
 
 
php
 
 
  1. <?php
  2. $q=$_GET["q"];
  4. echo "$q";
  5. ?>
 
 
 
魔芋测试：
4.gif
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

 



 

posted @ 2016-03-13 17:16  魔芋铃  阅读(253)  评论(2)  编辑  收藏  举报