同事问我，咱们从数据库里面获取数据，用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. 【POJ】3283 Card Hands

    字典树. #include <iostream> #include <cstdio> #include <cstring> #include <string& ...

  2. 实战weblogic集群之创建domain，AdminServer

    在weblogic安装完后,接下来就可以创建domain,AdminSever了. 第1步: $ cd /app/sinova/Oracle/wlserver_10./common/bin $ ./c ...

  3. 3 D. Least Cost Bracket Sequence

    题目大意: 这是一个规则的字符括号序列.一个括号序列是规则的,那么在序列里面插入‘+’ 和 ‘1’ 会得到一个正确的数学表达式. 合法:(())(), (),(()(())) 不合法:)(,((),( ...

  4. Fragmen横竖屏切换，导致页面混乱，oncreateView重复调用

    在清单文件Activity设置属性 android:screenOrientation="landscape" android:configChanges="screen ...

  5. hdu4666 最远曼哈顿距离

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4666 #include <cstdio> #include <cstring> ...

  6. Java Spring的 JavaConfig 注解

    序 传统spring一般都是基于xml配置的,不过后来新增了许多JavaConfig的注解.特别是springboot,基本都是清一色的java config,不了解一下,还真是不适应.这里备注一下. ...

  7. php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法

    php 获取今日.昨日.上周.本月的起始时间戳和结束时间戳的方法,主要使用到了 php 的时间函数 mktime.下面首先还是直奔主题以示例说明如何使用 mktime 获取今日.昨日.上周.本月的起始 ...

  8. ASP.NET MVC3 ModelState.IsValid为false的问题

    模型验证通常在submit后调用Action之前进行验证,eg: public class ZhengXing    {        [Key]        public int ZhengXin ...

  9. XPath总结（转）

    XPath简介 XPath是W3C的一个标准.它最主要的目的是为了在XML1.0或XML1.1文档节点树中定位节点所设计.目前有XPath1.0和XPath2.0两个版本.其中Xpath1.0是199 ...

  10. 【bzoj2333】 SCOI2011—棘手的操作

    http://www.lydsy.com/JudgeOnline/problem.php?id=2333 (题目链接) 题意 N个节点维护一些操作.. Solution 我们用可并大根堆进行维护. 对 ...