同事问我,咱们从数据库里面获取数据,用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. 掌握 Linux 调试技术

    掌握 Linux 调试技术 在 Linux 上找出并解决程序错误的主要方法 Steve Best (sbest@us.ibm.com)JFS 核心小组成员,IBM 简介: 您可以用各种方法来监控运行着 ...

  2. 「Poetize9」礼物运送

    3055: 礼物运送 Time Limit: 3 Sec  Memory Limit: 128 MBSubmit: 18  Solved: 12[Submit][Status] Description ...

  3. -_-#【jsonp】cache

    Cache jQuery’s JSONP Calls <script src="http://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.3 ...

  4. 数据结构(跳跃表):NOI 2004 郁闷的出纳员

    郁闷的出纳员 [问题描述] OIER公司是一家大型专业化软件公司,有着数以万计的员工.作为一名出纳员,我的任务之一便是统计每位员工的工资.这本来是一份不错的工作,但是令人郁闷的是,我们的老板反复无常, ...

  5. 贪心 uvaoj 11134 Fabled Rooks

    Problem F: Fabled Rooks We would like to place n rooks, 1 ≤ n ≤ 5000, on a n×n board subject to the ...

  6. 【宽搜】Vijos P1360 八数码问题

    题目链接: https://vijos.org/p/1360 题目大意: 3x3格子上放1~8数字,一个空位,每次空位可与上下左右交换,固定终止布局,求输入的起始布局需要几步到达终止布局 题目思路: ...

  7. MFC 显示CImg图片

    很多示例关于CImg都是基于控制台的,如何把它用于MFC中显示. Problem:直接按照控制台示例写入MFC程序中,当程序执行完display后,其后面的代码便不再执行. solution:开辟新的 ...

  8. 从cpu加电到加载OS内核的详细过程(清华大学ucore-lab1总结一)

    结合最近学习清华的OS课,先用“人话”来高度抽象的描述一下我自己的理解.CPU在系统加电也就是我们按下电源开关后,开始初始化他的寄存器,主要是cs和eip(本文基于x86架构),然后在ROM中找到一个 ...

  9. Wireless Password - HDU 2825(ac自动机+状态压缩)

    题目大意:有个人想破解他邻居的密码,他邻居告诉了一些关于这个密码的信息,并且给他一个单词集合,他用这些信息判断一下最少有多少种密码. 1->, 所有的密码都是有小写字母组成. 2->,密码 ...

  10. python-从redis数据库中读数据

    读string,list,set,sort_set,hash类型的数据 import redis class DataBase: def __init__(self, host, port): sel ...