php的ajax简单实例


Posted in PHP onFebruary 27, 2014

php的ajax简单实例

当输入j后,会触发ajax效果,从后台获取相应的名字中带有j的数据,并展示在suggestions中。

代码实现如下:

实现ajax需要三个文件,一个是html的表单文件,一个是js的核心文件,一个是php的后台文件。

下面的是html文件,当键盘按下时触发showHint方法,在showHint方法中会有ajax的核心内容,实例化,获取地址,获取数据并展示等等。

<html>
<head>
<script src="clienthint.js"></script> 
</head>
<body>
<form> 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>

 

下面是js的内容clienthint.js。

var xmlHttp
function showHint(str)
{
if (str.length==0)
 { 
 document.getElementById("txtHint").innerHTML=""
 return
 }
//获取xmlHttpObject对象,如果为空,提示浏览器不支持ajax
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 } 
 //获取url
var url="gethint.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
 //回调函数,执行动作
xmlHttp.onreadystatechange=stateChanged 
 //open
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
} 
function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{ 
//将获取的信息插入到txtHint中
document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
} 
}

//获取xml对象
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
 {
 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
 }
catch (e)
 {
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
}
return xmlHttp;
}

下面是php的内容。根据ajax对象传入的参数,获取相应的数据。

<?php
// Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Jiqing";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//get the q parameter from URL
$q=$_GET["q"];
//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
 {
 if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
   {
   if ($hint=="")
     {
     $hint=$a[$i];
     }
   else
     {
     $hint=$hint." , ".$a[$i];
     }
   }
 }
}
//Set output to "no suggestion" if no hint were found
//or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//output the response
echo $response;
?>
PHP 相关文章推荐
php设计模式 Proxy (代理模式)
Jun 26 PHP
mysql总结之explain
Feb 27 PHP
PHP基础学习之流程控制的实现分析
Apr 28 PHP
php通过字符串调用函数示例
Mar 02 PHP
windows7下安装php的php-ssh2扩展教程
Jul 04 PHP
PHP 抽象方法与抽象类abstract关键字介绍及应用
Oct 16 PHP
PHP中预定义的6种接口介绍
May 12 PHP
thinkPHP的表达式查询用法详解
Sep 14 PHP
PHP redis实现超迷你全文检索
Mar 04 PHP
PHP文件管理之实现网盘及压缩包的功能操作
Sep 20 PHP
PHP设计模式之模板方法模式定义与用法详解
Apr 02 PHP
浅谈laravel数据库查询返回的数据形式
Oct 21 PHP
php中require和require_once的区别说明
Feb 27 #PHP
php更新修改excel中的内容实例代码
Feb 26 #PHP
php获取文件大小的方法
Feb 26 #PHP
PHP批量上传图片的具体实现方法介绍.
Feb 26 #PHP
php把session写入数据库示例
Feb 26 #PHP
php操作mysql数据库的基本类代码
Feb 25 #PHP
php获取bing每日壁纸示例分享
Feb 25 #PHP
You might like
Laravel 5.0 发布 新版本特性详解
2015/02/10 PHP
php中JSON的使用方法
2015/04/30 PHP
PHP通过API获取手机号码归属地
2015/05/28 PHP
发现的以前不知道的函数
2006/09/19 Javascript
JS实现简单的顶部定时关闭层效果
2014/06/15 Javascript
js实现获取焦点后光标在字符串后
2014/09/17 Javascript
javascript实现在线客服效果
2015/07/15 Javascript
如何用JavaScript实现动态修改CSS样式表
2016/05/20 Javascript
Js 获取、判断浏览器版本信息的简单方法
2016/08/08 Javascript
Angularjs 实现一个幻灯片示例代码
2016/09/08 Javascript
JS 对java返回的json格式的数据处理方法
2016/12/05 Javascript
两种简单的跨域方法(jsonp、php)
2017/01/02 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
详解node服务器中打开html文件的两种方法
2017/09/18 Javascript
ES6中Class类的静态方法实例小结
2017/10/28 Javascript
JavaScript怎样在删除前添加确认弹出框?
2019/05/27 Javascript
ES6 class的应用实例分析
2019/06/27 Javascript
在Layui中实现开关按钮的效果实例
2019/09/29 Javascript
详解vue中在循环中使用@mouseenter 和 @mouseleave事件闪烁问题解决方法
2020/04/07 Javascript
[04:11]DOTA2亚洲邀请赛小组赛第一日 TOP10精彩集锦
2015/01/30 DOTA
巧用python和libnmapd,提取Nmap扫描结果
2016/08/23 Python
python 接口返回的json字符串实例
2018/03/27 Python
python使用rpc框架gRPC的方法
2018/08/24 Python
利用Python的sympy包求解一元三次方程示例
2019/11/22 Python
Python3和pyqt5实现控件数据动态显示方式
2019/12/13 Python
Python实现剪刀石头布小游戏(与电脑对战)
2019/12/31 Python
python 实现人和电脑猜拳的示例代码
2020/03/02 Python
python 调整图片亮度的示例
2020/12/03 Python
详解CSS3的图层阴影和文字阴影效果使用
2016/06/09 HTML / CSS
美国翻新电子产品商店:The Store
2019/10/08 全球购物
供货协议书
2014/04/22 职场文书
在校实习生求职信
2014/06/18 职场文书
合同意向书范本
2014/07/30 职场文书
SQL实现LeetCode(176.第二高薪水)
2021/08/04 MySQL
Python os和os.path模块详情
2022/04/02 Python
小程序自定义轮播图圆点组件
2022/06/25 Javascript