同事问我，咱们从数据库里面获取数据，用ajax的方式展示到前台页面。啥都不说了，动手写个案例吧。

1，建立一个页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

　　<script type="text/javascript" src="ajax.js"></script>

　　<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

　　<title>Ajax demo</title>

</head>

<body>

　　<input type="button" id="txt1" onclick="showHint()" value="获取123"/>

　　<p>数字：<span id="txtHint"></span></p>

</body>

</html>

2.写一个js，就是ajax

 var xmlhttp;

 function showHint()

 {

     // 定义新的数组

     var array = new Array();

     // 创建XMLHttpRequest对象

     if (window.XMLHttpRequest)

     {// code for IE7+, Firefox, Chrome, Opera, Safari 现代浏览器

         xmlhttp=new XMLHttpRequest();

     }

     else

     {// code for IE6, IE5 用户低版本ie

         xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

     }

     // 设置请求类型,请求地址，以及是否启用异步处理请求，大多数设置开启 true

     xmlhttp.open("GET","gethint.php",true);

     // 将请求发送至服务器

     xmlhttp.send();

     // 处理onreadystatechange事件 我们规定当服务器响应已做好被处理的准备时所执行的任务

     xmlhttp.onreadystatechange=function()

     {

         if (xmlhttp.readyState==4 && xmlhttp.status==200)

         {

             document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

         }

     }

 }

3，好吧，写一个php吧，当成服务器。数据是假的。

 <?php

 // 用名字来填充数组

 $a[]="1";

 $a[]="2";

 $a[]="3";

 $hint="";

 for($i=0; $i<count($a); $i++)

 {

     $hint=$hint."  ".$a[$i];

 }

 $response=$hint;

 //输出响应

 echo $response;

 ?>

看一下界面：

点击按钮：

1,2,3，不多不少，出来了。

php 与 ajax 获取123的案例的更多相关文章

  1. JavaScript 在函数中使用Ajax获取的值作为函数的返回值

    解决:JavaScript 在函数中使用Ajax获取的值作为函数的返回值,结果无法获取到返回值 原因:ajax默认使用异步方式,要将异步改为同步方式 案例:通过区域ID,获取该区域下所有的学校 var ...

  2. vue ajax获取数据的时候，如何保证传递参数的安全或者说如何保护api的安全

    https://segmentfault.com/q/1010000005618139 vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全 点击提交,发送请求.但是api ...

  3. Ajax获取 Json文件提取数据

    摘自 Ajax获取 Json文件提取数据 1. json文件内容(item.json) [ { "name":"张国立", "sex":&q ...

  4. 页面滚动到底部自动 Ajax 获取文章

    页面滚动到底部自动 Ajax 获取文章  代码如下 复制代码 var _timer = {};function delay_till_last(id, fn, wait) {    if (_time ...

  5. 放养的小爬虫--京东定向爬虫(AJAX获取价格数据)

    放养的小爬虫--京东定向爬虫(AJAX获取价格数据) 笔者声明:只用于学习交流,不用于其他途径.源代码已上传github.githu地址:https://github.com/Erma-Wang/Sp ...

  6. qt qml ajax 获取 json 天气数据示例

    依赖ajax.js类库,以下代码很简单的实现了获取天气json数据并展示的任务 [TestAjax.qml] import QtQuick 2.0 import "ajax.js" ...

  7. vue 中使用 AJAX获取数据的方法

    在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...

  8. 用ajax获取后台数据，返回json数据，怎么在前台使用？

    用ajax获取后台数据,返回json数据,怎么在前台使用呢?后台 C# code   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == &qu ...

  9. ajax获取json对象

    ajax获取json对象 ajax获取json数据,都是一个原理,设置response 的Content-Type:application/json,这样浏览器自动会解析为json对象 $result ...

随机推荐

  1. Java中的属性与字段的区别

    Java中属性和字段的区别  Java中的属性,通常可以理解为其属名性时根据get和set方法名得出的. 其规则是:去掉get或set后其剩余的字符串,如果第二个字母是小写的,则把第一个字母也变成小写 ...

  2. Shader Forge 刀光溶解

    实际特效时,时间可以控制vertex color.a,shader forge 还只是玩具,试验用具,离商业产品质量还有差距. 其实,有技术美术的画,很多问题,美术能自己解决,都是一些欠缺通道的问题, ...

  3. [Javascript] Promise

    Promise 代表着一个异步操作,这个异步操作现在尚未完成,但在将来某刻会被完成. Promise 有三种状态 pending : 初始的状态,尚未知道结果 fulfilled : 代表操作成功 r ...

  4. POJ 2376 贪心

    题意:FJ希望它的牛做一些清洁工作.有N只牛和T个时间段,每只牛可以承担一段时间内的工作.FJ希望让最小数量的牛覆盖整个T,求出其数量.若无法覆盖整个T,则输出-1. 分析:首先要注意T表示T个时间段 ...

  5. CentOS虚拟机不能联网状况下yum方式从本地安装软件包(转载的)

    大家都知道yum是linux下一个非常好用的软件安装/卸载软件,它方便操作,而且最厉害的是可以解决令人头疼的包依赖关系.但是若是你的linux不能联网,若想使用yum安装软件,可以依照下面的方法. 1 ...

  6. HTTP协议之状态码详解

    转自:http://www.cnblogs.com/TankXiao/ 什么是HTTP状态码 HTTP状态码的作用是:Web服务器用来告诉客户端,发生了什么事. 状态码位于HTTP Response ...

  7. python环境配置selenium与IE、Chrome、Firefox、PhantomJS

    安装.升级selenium pip install -U selenium 下载对应平台最新版的browser driver chrome: http://chromedriver.storage.g ...

  8. Asp.Net Mvc后台数据验证自测小Demo

    使用过MVC的同学一定不陌生MVC的模型绑定和模型校验,使用起来非常方便,定义好Entity之后,在需要进行校验的地方可以打上相应的Attribute,在Action开始时检查ModelState的I ...

  9. Django admin进阶

    1. ModelAdmin.inlines 将有外键的子类包含进视图 ,实例: class Author(models.Model): name = models.CharField(max_leng ...

  10. [置顶] Oracle 11g R2 RAC：使用 srvctl 工具管理 service 资源

    1.使用 srvctl 工具创建 service 资源 srvctl add service -d db_unique_name -s service_name {-r "preferred ...