Ajax取PHP JSON数据并显示
<!DOCTYPE html>
<html lang="zh"> <head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
<title>Document</title>
</head> <body style="padding-top: 30px;">
<button id="btnJson">JSON</button>
<table class="table"></table>
<script type="text/javascript">
$(function() {
$("#btnJson").click(function() {
$.ajax({
type: "get",
url: "json.php",
dataType: "json",
async: true,
success: function(data) {
var item;
$.each(data, function(i, result) {
item = "<tr><td>" + result['city'] + "</td><td>" + result['phone'] + "</td></tr>";
$('.table').append(item);
});
}
});
})
})
</script>
</body> </html>
JSON.PHP
<?php
$host = '127.0.0.1';
$user = 'root';
$password = '';
$database = 'yiibaidb';
$conn = new mysqli($host, $user, $password, $database);
if (!$conn) {
die("数据库连接失败!" . $conn -> connect_error);
}
$sql = "SELECT * FROM `offices`";
$result = $conn -> query($sql);
$arr = array();
if ($result -> num_rows > 0) {
while ($rows = $result -> fetch_assoc()) {
$arr[] = $rows;
}
}
echo json_encode($arr);
$conn -> close();
?>
Ajax取PHP JSON数据并显示的更多相关文章
- jquery通过ajax方法获取json数据不执行success
1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...
- jQuery Ajax异步处理Json数据详解
先我们来看一个官方的实例使用 AJAX 请求来获得 JSON 数据,并输出结果: $("button").click(function(){ $.getJSON("dem ...
- AJAX如何接收JSON数据
简介 在我们了解如何使用AJAX返回JSON数据的时候要先明白下列几点 1. JSON如何来表示对象的 2. JSON如何来表示数组的 var object = { "labId" ...
- jquery通过ajax方法获取json数据不执行success回调
问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...
- Javascript实例技巧精选(6)—滚动鼠标中键读取Json数据分页显示网页内容
>>点击这里下载完整html源码<< 截图如下: 滚动鼠标中键读取Json数据分页显示网页内容,关键的Javascript如下: <script type="t ...
- spring mvc接收ajax提交的JSON数据,并反序列化为对象
需求:spring mvc接收ajax提交的JSON数据,并反序列化为对象,代码如下: 前台JS代码: //属性要与带转化的对象属性对应 var param={name:'语文',price:16}; ...
- 使用Ajax方式POST JSON数据包(转)
add by zhj: 用ajax发送json数据时注意两点, 第一,使用JSON.stringify()函数将data转为json格式的字符串,如下 data: JSON.stringify({ ...
- django 使用Ajax方式POST JSON数据包
示例1: js: function SaveAction(){ //点击 保存按键 var senddata = {"type":"A", "host ...
- 在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法
在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法 最近在做一个小东西,使用kindeditor上传图片的时候,自己写了一个上传的方法,按照协议规则通过ajax返回json ...
随机推荐
- FFmpeg: FFmepg中的sws_scale() 函数分析
FFmpeg中的 sws_scale() 函数主要是用来做视频像素格式和分辨率的转换,其优势在于:可以在同一个函数里实现:1.图像色彩空间转换, 2:分辨率缩放,3:前后图像滤波处理.不足之处在于:效 ...
- halcon应用案例探究
14.1 Access 1. get_region_chain 功能:一个对象的轮廓(contour)作为链式码. 2. get_region_contour 功能:查询一个目标的轮廓(contou ...
- HTML 09 web 内容与攻击技术
Servlet 改进 CGI 之前提及的 CGI, 由于每次接到请求, 程序都要跟着启动一次, 因此一旦访问量过大, web 服务器要承担低昂当大的负载, 而 servlet 运行在与 web 服务器 ...
- 想拥有一款钢铁侠Jarvis管家的软件吗?
漫威的<钢铁侠>电影很好看,里面钢铁侠的管家Jarvis,可以说非常酷.既能管理日常生活,还能组装钢铁战衣.跟随托尼出生入死,形影不离. 那么现实生活中,想不想拥有这一款软件?看看下面这个 ...
- Vue之初识Vue
前言 如果你之前已经习惯了用jQuery操作DOM,学习Vue.js时请先抛开手动操作DOM的思维, 因为Vue.js是数据驱动的,你无需手动操作DOM.它通过一些特殊的HTML语法,将DOM和 数据 ...
- 解决webdiyer:AspNetPager分页控件在IE模式下点击页号不能翻页的问题。
在网站根目录下新建ie.browser文件, 然后用记事本打开. 将以下代码粘贴进去,保存即可,目的是让其与IE11的 UserAgent 匹配,使 .net framework 认识这是一个已知的浏 ...
- rabbitmq消费端加入精确控频。
控制频率之前用的是线程池的数量来控制,很难控制.因为做一键事情,做一万次,并不是每次消耗的时间都相同,所以很难推测出到底多少线程并发才刚好不超过指定的频率. 现在在框架中加入控频功能,即使开200线程 ...
- Oracle 11G 安装文档
一. 将文件win32_11gR2_database_1of2.zip和win32_11gR2_database_2of2.zip解压. 注意:这两个文件解压到同一个目录下,即:将Components ...
- Sqlalchemy model 文件自动生成
自动生成Sqlalchemy的models文件的包早用过了,有个字段类型做了改动,调了得10几分钟才搞定.记录下自动生成models文件的python包sqlacodegen sqlacodegen已 ...
- Win8驱动的兼容性问题
引用注明>> [作者:张佩][原文:www.yiiyee.cn/blog] 最近我发现为Win8开发的驱动程序,有些能安装在Win7上(包括更早系统),有些则不能.那些不能安装的情况很可怕 ...