原生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 服务器配置(使用Apache及IIS两种方法)
Jun 01 PHP
PHP实现今天是星期几的几种写法
Sep 26 PHP
PHP中的reflection反射机制测试例子
Aug 05 PHP
php编写的一个E-mail验证类
Mar 25 PHP
Cygwin中安装PHP方法步骤
Jul 04 PHP
PHP实现加强版加密解密类实例
Jul 29 PHP
纯php生成随机密码
Oct 30 PHP
详解WordPress中添加友情链接的方法
May 21 PHP
zend框架实现支持sql server的操作方法
Dec 08 PHP
2017年最新PHP经典面试题目汇总(上篇)
Mar 17 PHP
php实现网页上一页下一页翻页过程详解
Jun 28 PHP
详解PHP 7.4 中数组延展操作符语法知识点
Jul 19 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 加密解密内部算法
2010/04/22 PHP
PHP高手需要要掌握的知识点
2014/08/21 PHP
PHP调用.NET的WebService 简单实例
2015/03/27 PHP
prettify 代码高亮着色器google出品
2010/12/28 Javascript
javascript闭包传参和事件的循环绑定示例探讨
2014/04/17 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
纯CSS3代码实现滑动开关效果
2015/08/19 Javascript
js实现上一页下一页的效果【附代码】
2016/03/10 Javascript
老生常谈javascript中逻辑运算符&amp;&amp;和||的返回值问题
2017/04/13 Javascript
通过构造函数实例化对象的方法
2017/06/28 Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
2017/09/14 Javascript
微信小程序实现多宫格抽奖活动
2020/04/15 Javascript
详解vue-router 命名路由和命名视图
2018/06/01 Javascript
JavaScript模板引擎原理与用法详解
2018/12/24 Javascript
JS块级作用域和私有变量实例分析
2019/05/11 Javascript
JavaScript箭头函数中的this详解
2019/06/19 Javascript
layui 点击重置按钮, select 并没有被重置的解决方法
2019/09/03 Javascript
vue quill editor 使用富文本添加上传音频功能
2020/01/14 Javascript
树莓派中python获取GY-85九轴模块信息示例
2013/12/05 Python
Python 学习教程之networkx
2019/04/15 Python
Python中使用gflags实例及原理解析
2019/12/13 Python
python标识符命名规范原理解析
2020/01/10 Python
以SQLite和PySqlite为例来学习Python DB API
2020/02/05 Python
浅谈keras中的后端backend及其相关函数(K.prod,K.cast)
2020/06/29 Python
Python Charles抓包配置实现流程图解
2020/09/29 Python
Python SQLAlchemy库的使用方法
2020/10/13 Python
美国椅子和沙发制造商:La-Z-Boy
2020/10/25 全球购物
职业道德模范事迹材料
2014/08/24 职场文书
县政府领导班子“四风”方面突出问题整改措施
2014/09/23 职场文书
2014年科室工作总结范文
2014/12/19 职场文书
党员证明模板
2015/06/19 职场文书
2019思想汇报范文
2019/05/21 职场文书
Mysql服务添加 iptables防火墙策略的方案
2021/04/29 MySQL
解析MySQL索引的作用
2022/03/03 MySQL
python模板入门教程之flask Jinja
2022/04/11 Python
Mysql中@和@@符号的详细使用指南
2022/06/05 MySQL