23.4 在PHP中应用Ajax技术的典型应用

视频讲解：光盘TMlx23在PHP中应用Ajax技术的典型应用．exe

23.4.1 在PHP中应用Ajax技术检测用户名

【例23.1】本例主要通过Ajax技术实现不刷新页面检测用户名是否被占用。（实例位置：光盘TMsl231）

程序的开发步骤如下：

（1）搭建Ajax开发框架，代码如下：

（2）编写JavaScript的自定义函数checkName()，用于检测用户名是否为空，当用户名不为空时，调用createRequest()函数发送请求检测用户名是否存在，代码如下：

在上面的代码中，必须添加清除缓存的代码（加粗的代码部分），否则程序将不能正确检测用户名是否被占用。

（3）在页面的适当位置添加“检测用户名”超链接，在该超链接的onclick事件中调用checkName方法弹出显示检测结果的对话框，关键代码如下：

<a href="#" onClick="checkName(); ">[检测用户名]</a>

（4）编写检测用户名是否唯一的PHP处理页checkname.php，在该页面中使用PHP的echo语句输出检测结果，完整代码如下：

<?php header('Content-type: text/html; charset=GB2312'); //指定发送数据的编码格式为GB2312 $link=mysqli_connect("localhost", "root", "111"); mysqli_select_db($link, "db_database23"); mysqli_query($link, "set names gb2312"); $username=$_GET['username']; $sql=mysqli_query($link, "select ＊ from tb_user where name='".$username."'"); $info=mysqli_fetch_array($sql); if ($info){ echo "很抱歉！用户名[".$username."]已经被注册！"; }else{ echo "祝贺您！用户名[".$username."]没有被注册！"; } ?>

运行本例，在“用户名”文本框中输入“纯净水”，单击“检测用户名”超链接，即可在不刷新页面的情况下弹出“祝贺您！用户名[纯净水]没有被注册！”的提示对话框，如图23.3所示。

图23.3 检测用户名

23.4.2 在PHP中应用Ajax技术实现博客文章类别添加

【例23.2】本例主要通过Ajax技术实现无刷新的博客文章类别添加。（实例位置：光盘TMsl232）

程序的开发步骤如下：

（1）搭建Ajax开发框架，具体代码如下：

在上面的代码中，要特别注意的是加粗部分的代码，sort_id是显示文章分类信息的单元格id属性，将在本例的步骤（4）中介绍。innerHTML属性声明了元素含有的HTML文本，不包括元素本身的开始标记和结束标记，该属性用于指定HTML文本替换元素的内容。

（2）编写JavaScript的自定义函数check_sort()用于检测欲添加的类别名称是否为空，当类别名称文本框不为空时调用createRequest()函数发送请求获取添加类别信息到数据库中，代码如下：

（3）在下拉列表中动态输出博客文章的类别信息，这里更重要的是将第一行代码中单元格的id属性设置为sort_id，便于在JavaScript脚本中调用。另外，在“添加分类”图像的onclick事件中调用checksort方法，代码如下：

<td width="14%"valign="baseline"id="sort id"> <table border="0" cellpadding="0" cellspacing="0"> <tr> <td> <select name="select" > <?php $link=mysqli_connect("localhost", "root", "111"); //连接MySQL数据库服务器 mysqli_select_db($link, "db_database23"); //选择数据库文件 mysqli_query($link, "set names gb2312"); //设置数据库编码类型为GB2312 $sql=mysqli_query($link, "select distinct ＊ from tb_sort group by sort"); $result=mysqli_fetch_object($sql); //检索数据表中的信息 do{ header('Content-type: text/html; charset=GB2312'); //指定发送数据的编码格式为GB2312 ?> <option value="<?php echo $result->sort; ?>" selected><?php echo $result->sort; ?></option> <?php }while($result=mysqli_fetch_object($sql)); ?> </select> </td> <td width="20%" height="21" align="right" valign="baseline"> <input name="txt_sort" type="text" id="txt_sort" size="12" style="border:1px #64284A solid; height:21"> </td> <td width="49%" height="21" align="left" valign="baseline"> <img src="images/add.gif"width="67"height="23"onclick="checksort(); "> </td> </tr> </table> </td>

（4）编写添加分类信息到PHP处理页checksort.php，在该页面首先从数据表中获取博客分类信息，然后添加到数据库中，最后显示在下拉列表中，完整代码如下：

<?php $link=mysqli_connect("localhost", "root", "111"); mysqli_select_db($link, "db_database23"); mysqli_query($link, "set names gb2312"); $sort=$_GET['txt_sort']; mysqli_query($link, "insert into tb_sort(sort) values('$sort')"); header('Content-type: text/html; charset=GB2312'); //指定发送数据的编码格式为GB2312 ?> <! -- 下面的代码部分是单元格id属性中的代码部分，与步骤（3）等同，只是不包括元素本身的开始标记和结束标记<td width="14%"valign="baseline"id="sort_id">，该属性用于指定HTML文本替换元素的内容。 --! > <table border="0" cellpadding="0" cellspacing="0"> <tr> <td> <select name="select" > <?php $link=mysqli_connect("localhost", "root", "111"); //连接MySQL数据库服务器 mysqli_select_db($link, "db_database23"); //选择数据库文件 mysqli_query($link, "set names gb2312"); //设置数据库编码类型为GB2312 $sql=mysqli_query($link, "select distinct ＊ from tb_sort group by sort"); $result=mysqli_fetch_object($sql); //检索数据表中的信息 do{ header('Content-type: text/html; charset=GB2312'); //指定发送数据的编码格式为GB2312 ?> <option value="<?php echo $result->sort; ?>" selected><?php echo $result->sort; ?></option> <?php }while($result=mysqli_fetch_object($sql)); ?> </select> </td> <td width="20%" height="21" align="right" valign="baseline"> <input name="txt_sort" type="text" id="txt_sort" size="12" style="border:1px #64284A solid; height:21"> </td> <td width="49%" height="21" align="left" valign="baseline"> <img src="images/add.gif" width="67" height="23" onclick="checksort(); "> </td> </tr> </table>

运行本例，在“文章类别”后面的文本框中输入“心灵感悟”，单击“添加分类”按钮，即可在“文章类别”下拉列表框中成功添加该分类信息，如图23.4所示。