原生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中static静态变量的使用方法详解
Jun 04 PHP
PHP原理之异常机制深入分析
Aug 08 PHP
php报表之jpgraph柱状图实例代码
Aug 22 PHP
解密ThinkPHP3.1.2版本之模块和操作映射
Jun 19 PHP
php用户注册时常用的检验函数实例总结
Dec 22 PHP
php实现session自定义会话处理器的方法
Jan 27 PHP
33道php常见面试题及答案
Jul 06 PHP
php中foreach结合curl实现多线程的方法分析
Sep 22 PHP
PHP递归删除多维数组中的某个值
Apr 17 PHP
PHP设计模式之原型模式定义与用法详解
Apr 03 PHP
PHP使用Curl实现模拟登录及抓取数据功能示例
Apr 27 PHP
php + ajax 实现的写入数据库操作简单示例
May 16 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代码在网页上生成图片
2015/07/01 PHP
PHP 进程池与轮询调度算法实现多任务的示例代码
2019/11/26 PHP
Javascript 按位左移运算符使用介绍(
2014/02/04 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
2015/12/08 Javascript
不得不分享的JavaScript常用方法函数集(上)
2015/12/23 Javascript
基于jQuery实现点击列表加载更多效果
2016/05/31 Javascript
Bootstrap表单制作代码
2017/03/17 Javascript
node文件上传功能简易实现代码
2017/06/16 Javascript
Vue 仿QQ左滑删除组件功能
2018/03/12 Javascript
jQuery中each方法的使用详解
2018/03/18 jQuery
WebPack配置vue多页面的技巧
2018/05/15 Javascript
JavaScript实现的文本框placeholder提示文字功能示例
2018/07/25 Javascript
详解angular2.x创建项目入门指令
2018/10/11 Javascript
详解微信小程序中组件通讯
2018/10/30 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
2019/05/13 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
python中Flask框架简单入门实例
2015/03/21 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
Python中的hypot()方法使用简介
2015/05/18 Python
Python获取昨天、今天、明天开始、结束时间戳的方法
2018/06/01 Python
Python设计模式之组合模式原理与用法实例分析
2019/01/11 Python
python实现远程控制电脑
2019/05/23 Python
一篇文章了解Python中常见的序列化操作
2019/06/20 Python
win7上tensorflow2.2.0安装成功 引用DLL load failed时找不到指定模块 tensorflow has no attribute xxx 解决方法
2020/05/20 Python
Django3中的自定义用户模型实例详解
2020/08/23 Python
python的dict判断key是否存在的方法
2020/12/09 Python
css3教程之倾斜页面
2014/01/27 HTML / CSS
CSS3实现文字描边的2种方法(小结)
2020/02/14 HTML / CSS
SportsDirect.com马来西亚:英国第一体育零售商
2018/11/21 全球购物
美国婴儿用品及配件购买网站:Munchkin
2019/04/03 全球购物
俄罗斯天然和有机产品、健康生活网上商店:Fitomarket.ru
2020/10/09 全球购物
旅游项目开发策划书
2014/01/18 职场文书
机关单位工作失职检讨书
2014/11/20 职场文书
伏羲庙导游词
2015/02/09 职场文书
反邪教学习心得体会
2016/01/15 职场文书
win10忘记pin密码登录不了怎么办?win10忘记pin密码登不进去的解决方法
2022/07/07 数码科技