jq:get获取json数据并以表格形式生成到页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jq-get方法</title>
<script type="text/javascript" src="../jquery-2.1.3.min.js"></script>
<script type="text/javascript">
$(function(){
$("input").click(function(){
$.get("test.json",function(data){
var data=data;
var str="<table border=1 width=100%>";
str+="<tr>";
for(var n in data[0]){
str+="<th>"+n+"</th>";
}
str+="</tr>";
for(var i=0;i<data.length;i++){
str+="<tr>";
for(var n in data[i]){
str+="<td align='center'>"+data[i][n]+"</td>";
}
str+="</tr>";
}
str+="</table>";
$("div").html(str);
})
})
})
</script>
</head>
<body>
<input type="button" value="向服务器发出异步请求" />
<div></div>
</body>
</html>
test.json文件:
[
{
"name": "艳艳",
"pass": "123456",
"age": "26"
},
{
"name": "张三",
"pass": "88888888",
"age": "28"
},
{
"name": "李四",
"pass": "111111",
"age": "29"
}
]
jq:get获取json数据并以表格形式生成到页面的更多相关文章
- Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据
jquery.tmpl.js 是一个模板js ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...
- Netflix Falcor获取JSON数据
Netflix开源了JavaScript库Falcor,它为从多个来源获取JSON数据提供了模型和异步机制. Netflix利用Falcor库实现通过JSON数据填充他们网页应用的用户界面.所有来自内 ...
- jquery通过ajax方法获取json数据不执行success
1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...
- jquery用ajax方式从后台获取json数据,将内容填充到下拉列表。
从后台获取json数据,将内容填充到下拉列表. url:链接 par:ID sel:下拉列表选择器 //获取下拉列表 function BuildSelectBox(url, par, sel) { ...
- JQuery 获取json数据$.getJSON方法的实例代码
这篇文章介绍了JQuery 获取json数据$.getJSON方法的实例代码,有需要的朋友可以参考一下 前台: function SelectProject() { var a = new Array ...
- android客户端从服务器端获取json数据并解析的实现代码
今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下 首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的U ...
- jquery通过ajax方法获取json数据不执行success回调
问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...
- (转)android客户端从服务器端获取json数据并解析的实现代码
今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下 首先客户端从服务器端获取json数据 1.利用HttpUrlConnection 复制代码 ...
- android客户端从服务器端获取json数据并解析的实现代码(重要)
首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的URL中获取数组 * @param urlPath * @return * @throws Exc ...
随机推荐
- 文成小盆友python-num11-(2) python操作Memcache Redis
本部分主要内容: python操作memcache python操作redis 一.python 操作 memcache memcache是一套分布式的高速缓存系统,由LiveJournal的Brad ...
- C程序设计语言练习题1-15
练习1-15 重新编写1.2节中的温度转换程序,使用函数实现温度转换计算. 代码如下: #include <stdio.h> // 包含标准库的信息. float fahrToCelsiu ...
- Git的思想和基本工作原理
Git的思想和基本工作原理 Chapter: 开始了解Git 1. 先谈谈版本控制的一些事 2. Git诞生背后的一些故事 3. 版本控制:集中式VS分布式 4. Git的思想和基本工作原理 5. G ...
- Java 单例总结
1:懒汉式,不保证线程安全 package com.yan.singleton; public class LazySingleton { private static final LazySingl ...
- zoj3658 Simple Function (函数值域)
Simple Function Time Limit: 2 Seconds Memory Limit: 32768 KB Knowing that x can be any real nu ...
- log.sh
#!/bin/echo Warnning, this library must only be sourced! # vim: set expandtab smarttab shiftwidth=4 ...
- JS(五)
感觉JS里面还是有很多小技巧的,知道套路了,其实实现起来其实也还没有想象中的那么复杂.不过我觉得还是要把所学的知识融会贯通吧,不能学了JS就忘了前面的知识,结合起来才会威力无穷. 1.跑马灯:弹弹弹 ...
- JS~模拟表单在新窗口打开,避免广告拦截
说起广告拦截,这应该是浏览器的一个特性,它会将window.open产生的窗口默认为一个广告,将它进行拦截,但有时,这不是我们所希望的,有时,我们就是需要它在客户端的浏览器上弹出一个新窗口,以展示数据 ...
- Problem with generating association inside dbml file for LINQ to SQL
Question: I have created a dbml file in my project, and then dragged two tables from a database into ...
- String path = request.getContextPath();这段什么用
<% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+ ...