PHP下Ajax的简单应用

最新推荐文章于 2024-08-22 09:44:18 发布

FarmGuo

最新推荐文章于 2024-08-22 09:44:18 发布

阅读量617

点赞数

分类专栏： Mac php 技巧文章标签： php ajax js

本文链接：https://blog.csdn.net/gph66/article/details/39188887

版权

技巧同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

Mac php

2 篇文章 0 订阅

订阅专栏

在大二的时候，学习ASP.NET时，听说过Ajax，也知道谷歌的很多应用都用的了Ajax，无奈对JS不感冒，去过图书馆几次，看了几遍，最终放弃。

现在回想起来确实可笑，那么简单的知识点，自己却感到如此恐惧。在ASP.NET中没有用过，那就在PHP中用一次吧。要理解Ajax，首先要懂的JS,Ajax的原理就是通过JS执行代码去请求数据，去做事情，将结果告诉我们就行了，我们根据结果来确定下一步的操作，最常用的就是刷新页面了。本程序由一个html文件，一个JS，一个PHP文件构成。重点就是JS获得用户在html中的输入，去访问PHP文件，将结果返回给html文件。功能是根据用户输入的姓名，去查找匹配的名字。

index.html文件代码如下：

<html>
<head>
<meta charset=utf-8>
<title>测试</title>
<script src="connect.js"></script>
</script>
</head>
<body>
<form>
姓氏:
<input type="combox" id="txt1" onkeyup ="showHint(this.value)">
<br>
</form>
<p>
建议:<span id ="txtHint" ></span></p>
</body>
</html>

connect.js文件代码如下：

var xmlHttp;
function showHint(str)
 {
     if(str.length == 0)
      {
         document.getElementById("txtHint").innerHTML="";
      }   

        xmlHttp =  new XMLHttpRequest();
     if(xmlHttp == null)
     {
        alert("Browser does not support HTTP Request.");
        return ;
     }
 var url="gethint.php";
 url=url+"?q="+str;
 xmlHttp.onreadystatechange = function()
 {
    if(xmlHttp.readyState==4 ||  xmlHttp.readyState =="complete")
    {
        document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
    }
 }
 xmlHttp.open("GET",url,true);
 xmlHttp.send();
 }

gethint.php代码如下：

<?php
$a[]="王安娜";
$a[]="王子先";
$a[]="曲大人";
$a[]="曹雪芹";
$a[]="李成才";
$a[]="张虎";
$a[]="刘超锐";
$a[]="赵丽丽";
$a[]="郭少龙";
$a[]="李清湖";
$a[]="马财义";
$a[]="胡春兰";
$a[]="高雪杰";
$a[]="孙高开";
$a[]="苏鑫";
$a[]="郭莫郜";
$a[]="李志强";
$a[]="赵云祥";
$a[]="肖国栋";
$q =$_GET["q"];
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];
            }
        }

    }
}

if($hint=="")
{
    $response="没有匹配";
}
else
{
    $response=$hint;
}
echo '<font color="blue">'.$response.'</font>';
echo'<br>OK<br>Date and Time is:<br>';
echo date("G:i:s a l,F j Y.");
?>

效果如如下：