1. <html>
  2. <head>
  3. <script src="clienthint.js"></script>
  4. </head>
  5. <body>
  6. <form>
  7. First Name:
  8. <input type="text" id="txt1"
  9. onkeyup="showHint(this.value)">
  10. </form>
  11. <p>Suggestions: <span id="txtHint"></span></p>
  12. </body>
  13. </html>
  1. clienthint.js
  1. var xmlHttp
  2. function showHint(str)
  3. {
  4. if (str.length==0)
  5. {
  6. document.getElementById("txtHint").innerHTML=""
  7. return
  8. }
  9. xmlHttp=GetXmlHttpObject()
  10. if (xmlHttp==null)
  11. {
  12. alert ("Browser does not support HTTP Request")
  13. return
  14. }
  15. var url="gethint.php"
  16. url=url+"?q="+str
  17. url=url+"&sid="+Math.random()
  18. xmlHttp.onreadystatechange=stateChanged
  19. xmlHttp.open("GET",url,true)
  20. xmlHttp.send(null)
  21. }
  22. function stateChanged()
  23. {
  24. if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  25. {
  26. document.getElementById("txtHint").innerHTML=xmlHttp.responseText
  27. }
  28. }
  29. function GetXmlHttpObject()
  30. {
  31. var xmlHttp=null;
  32. try
  33. {
  34. // Firefox, Opera 8.0+, Safari
  35. xmlHttp=new XMLHttpRequest();
  36. }
  37. catch (e)
  38. {
  39. // Internet Explorer
  40. try
  41. {
  42. xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  43. }
  44. catch (e)
  45. {
  46. xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  47. }
  48. }
  49. return xmlHttp;
  50. }

gethint.php

    1. <?php
    2. // Fill up array with names
    3. $a[]="Anna";
    4. $a[]="Brittany";
    5. $a[]="Cinderella";
    6. $a[]="Diana";
    7. $a[]="Eva";
    8. $a[]="Fiona";
    9. $a[]="Gunda";
    10. $a[]="Hege";
    11. $a[]="Inga";
    12. $a[]="Johanna";
    13. $a[]="Kitty";
    14. $a[]="Linda";
    15. $a[]="Nina";
    16. $a[]="Ophelia";
    17. $a[]="Petunia";
    18. $a[]="Amanda";
    19. $a[]="Raquel";
    20. $a[]="Cindy";
    21. $a[]="Doris";
    22. $a[]="Eve";
    23. $a[]="Evita";
    24. $a[]="Sunniva";
    25. $a[]="Tove";
    26. $a[]="Unni";
    27. $a[]="Violet";
    28. $a[]="Liza";
    29. $a[]="Elizabeth";
    30. $a[]="Ellen";
    31. $a[]="Wenche";
    32. $a[]="Vicky";
    33. //get the q parameter from URL
    34. $q=$_GET["q"];
    35. //lookup all hints from array if length of q>0
    36. if (strlen($q) > 0)
    37. {
    38. $hint="";
    39. for($i=0; $i<count($a); $i++)
    40. {
    41. if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
    42. {
    43. if ($hint=="")
    44. {
    45. $hint=$a[$i];
    46. }
    47. else
    48. {
    49. $hint=$hint." , ".$a[$i];
    50. }
    51. }
    52. }
    53. }
    54. //Set output to "no suggestion" if no hint were found
    55. //or to the correct values
    56. if ($hint == "")
    57. {
    58. $response="no suggestion";
    59. }
    60. else
    61. {
    62. $response=$hint;
    63. }
    64. //output the response
    65. echo $response;
    66. ?>

ajax 向php发送请求的更多相关文章

  1. 【03】AJAX 向服务器发送请求

    AJAX 向服务器发送请求   创建 XMLHttpRequest 对象后,就可以向服务器发送请求了. XMLHttpRequest 对象的 open() 方法和 send() 方法用来向服务器发送请 ...

  2. AJAX - 向服务器发送请求请求

    AJAX - 向服务器发送请求请求 XMLHttpRequest 对象用于和服务器交换数据.直线电机生产厂家 向服务器发送请求 如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 ...

  3. Ajax向服务器端发送请求

    Ajax向服务器端发送请求 Ajax的应用场景 页面上拉加载更多数据 列表数据无刷新分页 表单项离开焦点数据验证 搜索框提示文字下拉列表 Ajax运行原理 Ajax 相当于浏览器发送请求与接收响应的代 ...

  4. Ajax向Controller发送请求并接受数据需要注意的一个细节

    想用Ajax想向Controller发送请求和接收返回的字符等等.Controller中要使用@ResponseBody注解. <script type="text/javascrip ...

  5. AJAX向服务器发送请求

    使用 XMLHttpRequest 对象的 open() 和 send() 方法: 方法 描述 open(method,url,async) 规定请求的类型.URL 以及是否异步处理请求. metho ...

  6. 使用ajax向后台发送请求跳转页面无效的原因

    Ajax只是利用脚本访问对应url获取数据而已,不能做除了获取返回数据以外的其它动作了.所以浏览器端是不会发起重定向的. 1)正常的http url请求,只有浏览器和服务器两个参与者.浏览器端发起一个 ...

  7. 使用Ajax向服务器端发送请求

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  8. angularjs --- ngResource 类似于 ajax发送请求。

    <!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...

  9. Query通过Ajax向PHP服务端发送请求并返回JSON数据

    Query通过Ajax向PHP服务端发送请求并返回JSON数据 服务端PHP读取MYSQL数据,并转换成JSON数据,传递给前端Javascript,并操作JSON数据.本文将通过实例演示了jQuer ...

随机推荐

  1. [转帖]nginx配置ssl证书实现https访问

    https://www.cnblogs.com/tianhei/p/7726505.html 今天就是如此处理的 感觉挺不错的. 一,环境说明 服务器系统:ubuntu16.04LTS 服务器IP地址 ...

  2. MySQL慢查询—开启慢查询

    ###一.简介 开启慢查询日志,可以让MySQL记录下查询超过指定时间的语句,通过定位分析性能的瓶颈,才能更好的优化数据库系统的性能. ###二.参数说明 slow_query_log 慢查询开启状态 ...

  3. 小记--------SparkContext初始化原理机制图解

  4. IDEA自动生成的注释模板

    使用效果如下: * * @功能描述 : $params$ * @return $returns$ * @author xuetao */ 其中 $params$的表达式如下: groovyScript ...

  5. Javascript去掉base64中的回车换行

    给天津海关开发手机插件. 他们的API返回的文件base64遵循了RFC822规定,即BASE64编码每76个字符,还需要加上一个回车换行. 这就导致了我的Ant Design Mobile图片控件不 ...

  6. static char定义的用法

    static char *p是全局静态变量,char *p是临时变量,static定义的你在其他地方可以调用,而且是通用的,也就是说你在一个地方改了它的值,其他地方也就跟着改了,而char *p只是一 ...

  7. Codeforces 1178F2. Long Colorful Strip

    传送门 首先涂区间,那么区间最多有 $2n$ 个相邻位置不同的情况,并且连续相同的颜色可以合并起来 那么这样操作完以后,区间长度最多为 $2n$ 发现涂完一段区间以后其他的操作都不能出现一边在区间内而 ...

  8. 你不知道的css各类布局(四)之响应式布局

    响应式布局 概念 响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局 布局特点 响应式设计的目标是确保一个页面在所有终端上(各种尺寸的PC.手机.手表.冰箱的Web浏览器等等)都能显示出令人满意的效 ...

  9. 异常-try...catch的方式处理异常1

    package cn.itcast_02; /* * 我们自己如何处理异常呢? * A:try...catch...finally * B:throws 抛出 * * try...catch...fi ...

  10. 三、maven学习-高级

    maven父子工程