原生JS实现Ajax通过GET方式与PHP进行交互操作示例


Posted in PHP onMay 12, 2018

本文实例讲述了原生JS实现Ajax通过GET方式与PHP进行交互操作。分享给大家供大家参考,具体如下:

一、代码

conn.php

<?php
   $conn=mysql_connect("localhost","root","root") or die("数据库连接失败".mysql_error());
   mysql_select_db("db_database27",$conn) or die("数据库连接失败".mysql_error());
   mysql_query("set names gb2312");
?>

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>通过XMLHttpRequest对象读取HTML文件,并且输出读取结果</title>
<style type="text/css">
<!--
body {
  margin-left: 0px;
  margin-top: 00px;
  margin-right: 0px;
  margin-bottom: 0px;
}
-->
</style></head>
<script>
var xmlHttp;        //定义XMLHttpRequest对象
function createXmlHttpRequestObject(){
  //如果在internet Explorer下运行
  if(window.ActiveXObject){
    try{
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }catch(e){
      xmlHttp=false;
    }
  }else{
  //如果在Mozilla或其他的浏览器下运行
    try{
      xmlHttp=new XMLHttpRequest();
    }catch(e){
      xmlHttp=false;
    }
  }
   //返回创建的对象或显示错误信息
  if(!xmlHttp)
    alert("返回创建的对象或显示错误信息");
    else
    return xmlHttp;
}
function showsimple(){
  createXmlHttpRequestObject();
  var cont = document.getElementById("searchtxt").value;
  if(cont==""){
    alert('查询关键字不能为空!');
    return false;
  }
    xmlHttp.onreadystatechange=StatHandler; //判断URL调用的状态值并处理
    xmlHttp.open("GET",'searchrst.php?cont='+cont,false);
    xmlHttp.send(null);
}
function StatHandler(){
  if(xmlHttp.readyState==4 && xmlHttp.status==200){
    document.getElementById("webpage").innerHTML=xmlHttp.responseText;
  }
}
</script>
<body>
<table width="800" height="632" border="0" align="center" cellpadding="0" cellspacing="0" background="images/bj.jpg">
 <tr>
  <td width="260" height="245"> </td>
  <td width="500" align="center" valign="bottom"><strong>查询员工信息,根据员工技能信息</strong></td>
  <td width="40"> </td>
 </tr><form id="searchform" name="searchform" method="get" action="#">
 <tr>
  <td height="40"> </td>
  <td align="center">请输入关键字: <input name="searchtxt" type="text" id="searchtxt" size="30" />
    <input id="s_search" name="s_search" type="button" value="查询" onclick="return showsimple()" /></td>
  <td> </td>
 </tr> </form>
 <tr>
  <td height="268"> </td>
  <td align="center" valign="top"><div id="webpage"></div></td>
  <td> </td>
 </tr>
 <tr>
  <td> </td>
  <td> </td>
  <td> </td>
 </tr>
</table>
</body>
</html>

searchrst.php

<?php
header('Content-type: text/html;charset=GB2312');        //指定发送数据的编码格式
  include_once 'conn/conn.php';                //连接数据库
    $cont = $_GET['cont'];                 //获取Ajax传递的查询关键字
    if(!empty($_GET['cont'])){               //判断如果关键字不为空
      $sql = "select * from tb_administrator where explains like '%".$cont."%'"; //定义SQL语句
      $result=mysql_query($sql,$conn);          //执行模糊查询
      if(mysql_num_rows($result)>0){        //获取查询结果
        echo "<table width='500' border='1' cellpadding='1' cellspacing='1' bordercolor='#FFFFCC' bgcolor='#666666'>";
        echo "<tr><td height='30' align='center' bgcolor='#FFFFFF'>ID</td><td align='center' bgcolor='#FFFFFF'>名称</td><td align='center' bgcolor='#FFFFFF'>编号</td><td align='center' bgcolor='#FFFFFF'>描述</td></tr>";
 while($myrow=mysql_fetch_array($result)){           //循环输出查询结果
 echo "<tr><td height='22' bgcolor='#FFFFFF'>".$myrow[id]."</td>";
 echo "<td bgcolor='#FFFFFF'>".$myrow[user]."</td>";
  echo "<td bgcolor='#FFFFFF'>".$myrow[number]."</td>";
echo "<td bgcolor='#FFFFFF'>".$myrow[explains]."</td>";
echo "</tr>";
}
echo "</table>";
      }else{
      echo "没有符合条件的数据";
      }
    }
?>

二、运行结果

原生JS实现Ajax通过GET方式与PHP进行交互操作示例

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
PHP sprintf()函数用例解析
May 18 PHP
PHP服务器页面间跳转实现方法
Aug 02 PHP
探寻PHP脚本不报错的原因
Jun 12 PHP
Yii中CGridView关联表搜索排序方法实例详解
Dec 03 PHP
php继承中方法重载(覆盖)的应用场合
Feb 09 PHP
PHP中Session可能会引起并发问题
Jun 26 PHP
使用PHP uniqid函数生成唯一ID
Nov 18 PHP
PHPExcel简单读取excel文件示例
May 26 PHP
PHP文件管理之实现网盘及压缩包的功能操作
Sep 20 PHP
php工具型代码之印章抠图
Jul 18 PHP
PHP设计模式之建造者模式定义与用法简单示例
Aug 13 PHP
微信企业转账之入口类分装php代码
Oct 01 PHP
ThinkPHP框架实现导出excel数据的方法示例【基于PHPExcel】
May 12 #PHP
Laravel框架实现model层的增删改查(CURD)操作示例
May 12 #PHP
layui框架实现文件上传及TP3.2.3(thinkPHP)对上传文件进行后台处理操作示例
May 12 #PHP
PHP折半(二分)查找算法实例分析
May 12 #PHP
PHP区块查询实现方法分析
May 12 #PHP
可兼容php5与php7的cURL文件上传功能实例分析
May 11 #PHP
PHP5.0~5.6 各版本兼容性cURL文件上传功能实例分析
May 11 #PHP
You might like
php学习之运算符相关概念
2011/06/09 PHP
php生成局部唯一识别码LUID的代码
2012/10/06 PHP
ThinkPHP3.1新特性之多层MVC的支持
2014/06/19 PHP
Symfony2学习笔记之模板用法详解
2016/03/17 PHP
jQuery使用手册之一
2007/03/24 Javascript
JavaScript 组件之旅(三):用 Ant 构建组件
2009/10/28 Javascript
Google排名中的10个最著名的 JavaScript库
2010/04/27 Javascript
JavaScript中的私有/静态属性介绍
2012/07/26 Javascript
Node.js开发指南中的简单实例(mysql版)
2013/09/17 Javascript
动态添加option及createElement使用示例
2014/01/26 Javascript
推荐一个自己用的封装好的javascript插件
2015/01/29 Javascript
JQuery球队选择实例
2015/05/18 Javascript
jQuery原生的动画效果
2015/07/10 Javascript
基于jquery实现图片相关操作(重绘、获取尺寸、调整大小、缩放)
2015/12/25 Javascript
jQuery前端开发35个小技巧
2016/05/24 Javascript
jQuery简单实现向列表动态添加新元素的方法示例
2017/12/25 jQuery
layui type2 通过url给iframe子页面传值的例子
2019/09/06 Javascript
Vue 基于 vuedraggable 实现选中、拖拽、排序效果
2020/05/18 Javascript
vuex存取值和映射函数使用说明
2020/07/24 Javascript
原生js实现九宫格拖拽换位
2021/01/26 Javascript
Python语言描述随机梯度下降法
2018/01/04 Python
Python基于SMTP协议实现发送邮件功能详解
2018/08/14 Python
python 的 openpyxl模块 读取 Excel文件的方法
2019/09/09 Python
python实现不同数据库间数据同步功能
2021/02/25 Python
南京迈特望C/C++面试题
2012/07/09 面试题
SQL Server 2000数据库的文件有哪些,分别进行描述。
2015/11/09 面试题
建筑专业毕业生推荐信
2013/11/21 职场文书
自荐信封面
2013/12/04 职场文书
经典广告词大全
2014/03/14 职场文书
公务员培的训心得体会
2014/09/01 职场文书
财政局长个人总结
2015/03/04 职场文书
小学语文继续教育研修日志
2015/11/13 职场文书
银行工作心得体会范文
2016/01/23 职场文书
九年级化学教学反思
2016/02/22 职场文书
《曾国藩家书》读后感——读家书,立家风
2019/08/21 职场文书
Python 高级库15 个让新手爱不释手(推荐)
2021/05/15 Python