1、在MYSQL中新建一个test数据库,在里面新建一张type数据表,下面将从该表获得数据。
2、新建一个project小程序项目。
3、在project项目内,新建一个index模块来从数据库获得数据,并将数据输出在indexwxml页面。
4、在index模块中indexjs页面,在onLoad中使用wxrequest方法向服务端文件请求数据。url为请求数据的地址;data为传输的参数,这里设置为空;method为传递参数的方式,header用于设置请求的数据类型,success是成功获得数据后的 *** 作。
5、在indexwxml页面,使用for循环遍历输出indexjs传递过来的数据data,通过item将data数据输出在页面。
6、在服务端新建一个apiphp页面来接收微信小程序的数据请求。
7、最后编译微信小程序,查看从数据表type获得数据内容,成功从数据库读取数据并输出在页面上。
1原生AJAX代码
get请求:
//创建xhr,IE低版本不支持
var xhr = new XML>
有两种方法,一种是$ajax(option)方法,一种是$getJSON()方法。
实例:
一、数据集所在jsp页面outjsp,代码如下
<%@page contentType="text/plain; charset=UTF-8"
language="java"
import="javaio,javanet,javautil"
buffer="8kb"
session="false"
autoFlush="true"
%>
<%
String jsonData="{data:[{id:200901,name:'name1'},{id:200902,name:'name2'},{id:200903,name:'姓名3'},{id:200904,name:'姓名4'},{id:200905,name:'姓名5'}]}";
//outclear();
outwrite(jsonData);
%>
二、js处理页面
(1)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN" "">
<html xmlns="">
<head>
<title>test</title>
<meta >
如果不是Android开发环境的话,首先需要引入处理JSON数据的包:json-lib-223-jdk15jar
Java样例程序如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import netsfjsonJSONArray;
import netsfjsonJSONObject;
public class DoJSON {
public static void main(String[] args) {
JSONArray employees = new JSONArray(); //JSON数组
JSONObject employee = new JSONObject(); //JSON对象
employeeput("firstName", "Bill"); //按“键-值”对形式存储数据到JSON对象中
employeeput("lastName", "Gates");
employeesadd(employee); //将JSON对象加入到JSON数组中
employeeput("firstName", "George");
employeeput("lastName", "Bush");
employeesadd(employee);
employeeput("firstName", "Thomas");
employeeput("lastName", "Carter");
employeesadd(employee);
Systemoutprintln(employeestoString());
for(int i=0; i<employeessize(); i++) {
JSONObject emp = employeesgetJSONObject(i);
Systemoutprintln(emptoString());
Systemoutprintln("FirstName :\t" + empget("firstName"));
Systemoutprintln("LastName : \t" + empget("lastName"));
}
}
}
运行效果:
[{"firstName":"Bill","lastName":"Gates"},{"firstName":"George","lastName":"Bush"},{"firstName":"Thomas","lastName":"Carter"}]
{"firstName":"Bill","lastName":"Gates"}
FirstName : Bill
LastName : Gates
{"firstName":"George","lastName":"Bush"}
FirstName : George
LastName : Bush
{"firstName":"Thomas","lastName":"Carter"}
FirstName : Thomas
LastName : Carter
1、通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的。
jsonp是英文json with padding的缩写。它允许在服务器端生成script tags至返回至客户端,也就是动态生成javascript标签,通过javascript callback的形式实现数据读取。
html页面端示例代码:
复制代码 代码如下:
//首先要引入jquery的js包
jQuery(document)ready(function(){
$ajax({
type : "get", //jquey是不支持post方式跨域的
async:false,
url : ">
下面就使用jQuery读取musictxt文件中的JSON数据格式信息。
首先,musictxt中的内容如下:
复制代码 代码如下:
[
{"optionKey":"1", "optionValue":"Canon in D"},
{"optionKey":"2", "optionValue":"Wind Song"},
{"optionKey":"3", "optionValue":"Wings"}
]
下来是HTML代码:
复制代码 代码如下:
<div>点击按钮获取JSON数据</div>
<input type="button" id="button" value="确定" />
<div id="result"></div>
使用Ajax获取JSON数据的jQuery代码:
复制代码 代码如下:
$(document)ready(function(){
$('#button')click(function(){
$ajax({
type:"GET",
url:"musictxt",
dataType:"json",
success:function(data){
var music="<ul>";
//i表示在data中的索引位置,n表示包含的信息的对象
$each(data,function(i,n){
//获取对象中属性为optionsValue的值
music+="<li>"+n["optionValue"]+"</li>";
});
music+="</ul>";
$('#result')append(music);
}
});
return false;
});
});
当然,也可以使用$getJSON()方法,代码简洁一点:
复制代码 代码如下:
$(document)ready(function(){
$('#button')click(function(){
$getJSON('musictxt',function(data){
var music="<ul>";
$each(data,function(i,n){
music+="<li>"+n["optionValue"]+"</li>";
});
music+="</ul>";
$('#result')append(music);
});
return false;
});
});
1、首先我们要导入json包,新建一个对象。
2、接着直接调用jsondumps将对象转化为json格式,如下图所示,这是比较常用的。
3、我们可以输出一下转化以后的格式,如果显示是str则代表是json格式。
4、而将json格式转化为对象也是比较常用的,这就用到load函数了。
5、接下来大家还需要知道的是json模块所在的位置,就是安装目录的lib模块下。
6、最后你可以打开json文件夹,看一下里面其他的一些功能函数,都是从这里出来的。
一、使用js获取接口数据的方法
①$get(url,[data],[callback])
url:请求的地址;data:请求数据的列表;callback:请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个为服务器的状态,是可选参数。
其中服务器返回数据的格式其实是字符串形式,并不是我们想要的JSON数据格式。上例子:
var url3 = '>
以上就是关于微信小程序获取JSON数据时遇到多维数组,请教如何获取数据全部的内容,包括:微信小程序获取JSON数据时遇到多维数组,请教如何获取数据、servlet怎么获取ajax传过来的json数据、如何通过js获取json数据,传到页面等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)