基于jquery异步传输json数据格式实例代码

1.jsp代码如下

代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="<%=basePath%>js/jquery-1.8.1.js"></script>
</head>
<script type="text/javascript">
 $(function(){
  $("#getResult").click(function(){
   $.ajax({
    type:"post",
    url:"<%=basePath%>jsonAction!getData.action",
    dataType:"json",
    data:{'param1':$("#param1").attr("value"),'param2':$("#param2").attr("value")},
    success:function(returnData){
     var html = "<table border='1'><tr><td>编号</td><td>姓名</td><td>描述</td></tr>";
     for(var i = 0; i < returnData.length; i++){
      html += "<tr><td>"+returnData[i].id+"</td><td>"+returnData[i].name+"</td><td>"+returnData[i].description+"</td></tr>";
     }
     $("#result").html(html);
    }
   });
  });

});
</script>
<body>
 <input type="text" value="haha" id="param1">
 <input type="text" value="hehe" id="param2">
 <div  id="result"></div>
 <input type="button" value="获取" id="getResult">
</body>
</html>

2.访问 action代码如下

代码如下:

public class JsonAction extends ActionSupport{
 public void getData() throws IOException
 {
  HttpServletRequest req = ServletActionContext.getRequest();
  String p1 = req.getParameter("param1");
  String p2 = req.getParameter("param2");

HttpServletResponse rep = ServletActionContext.getResponse();
  rep.setContentType("text/json;charset=utf-8");
  PrintWriter pw = rep.getWriter();
  String data = "[{\"id\":\"01\",\"name\":\"zhongqian\",\"description\":\""+p1+"\"},{\"id\":\"02\",\"name\":\"zhangsan\",\"description\":\""+p2+"\"}]";
  pw.print(data);
  pw.flush();
 }
}

3.效果如下：

赞 (0)

相关推荐

  • jqeury eval将字符串转换json的方法

    前台页面 复制代码 代码如下: $.ajax({ type: "post", contentType: "application/json", url: "../WebForm1.aspx/GetRightsStr", dataType: "json", success: function (msg) { alert(msg.d); var data = eval("(" + msg.d + ")

  • android调用国家气象局天气预报接口json数据格式解释

    国家气象局提供了三种数据的形式 网址在: http://www.weather.com.cn/data/sk/101010100.html http://www.weather.com.cn/data/cityinfo/101010100.html http://m.weather.com.cn/data/101010100.html 最后一种是解析最全面的. 数据解析格式: 第一个网址提供的json数据为: 复制代码 代码如下: {"weatherinfo":{"city&

  • JQuery 解析多维的Json数据格式

    这就要利用到JQuery,ASHX以及Json来合作了.一篇文章有多个评论,每十个为一页.用户每点击下一页则自动抓去下一页,这个过程采用无刷新放心进行. Json格式其实和表格式有异曲同工之妙,在网络传输中,它比XML还省流量,而且与JS有更好的融合,更容易被解析.Json格式样例如下: 复制代码 代码如下: {"Products":[ {"orderid":"11077","customerid":"RATTC&q

  • android 解析json数据格式的方法

    json数据格式解析我自己分为两种: 一种是普通的,一种是带有数组形式的: 普通形式的:服务器端返回的json数据格式如下: 复制代码 代码如下: {"userbean":{"Uid":"100196","Showname":"\u75af\u72c2\u7684\u7334\u5b50","Avtar":null,"State":1}} 分析代码如下: 复制代码 代

  • Android App数据格式Json解析方法和常见问题

    (1).解析Object之一: 复制代码 代码如下: {"url":"http://www.cnblogs.com/qianxudetianxia"} 解析方法: 复制代码 代码如下: JSONObject demoJson = new JSONObject(jsonString);String url = demoJson.getString("url"); (2).解析Object之二: 复制代码 代码如下: {"name"

  • js 将json字符串转换为json对象的方法解析

    例如: JSON字符串: var str1 = '{ "name": "cxh", "sex": "man" }'; JSON对象: var str2 = { "name": "cxh", "sex": "man" }; 一.JSON字符串转换为JSON对象 要使用上面的str1,必须使用下面的方法先转化为JSON对象: //由JSON字符串转换为

  • Json对象与Json字符串互转(4种转换方式)

    1>jQuery插件支持的转换方式: 复制代码 代码如下: $.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象 2>浏览器支持的转换方式(Firefox,chrome,opera,safari,ie9,ie8)等浏览器: 复制代码 代码如下: JSON.parse(jsonstr); //可以将json字符串转换成json对象 JSON.stringify(jsonobj); //可以将json对象转换

  • 实例详解JSON数据格式及json格式数据域字符串相互转换

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSON采用完全独立于语言的文本格式,这些特性使JSON成为理想的数据交换语言.易于人阅读和编写,同时也易于机器解析和生成. 基础结构 JSON建构于两种结构: 1. "名称/值"对的集合(A collection of name/value pairs).不同的语言中,它被理解为对象(object),记录(record),结构(struct),字典(dictionary),哈希表(hash t

  • jQuery.parseJSON(json)将JSON字符串转换成js对象

    概述 接受一个JSON字符串,返回解析后的对象. 传入一个畸形的JSON字符串会抛出一个异常.比如下面的都是畸形的JSON字符串: {test: 1} ( test 没有包围双引号) {'test': 1} (使用了单引号而不是双引号) 另外,如果你什么都不传入,或者一个空字符串.null或undefined,parseJSON都会返回 null . 参数 jsonString 要解析的JSON字符串 示例 描述: 解析一个JSON字符串 jQuery 代码: var str = '{"name

  • JSON 数据格式介绍

    1,基础 这篇文章讲的比较深入,所以不用我画蛇添足了,只是下面这段代码很好的演示了JSON如何处理字符串数据,保存下来备查: zt from:https://www.ibm.com/developerworks/cn/web/wa-lo-json/ 将 String 对象编码为 JSON 格式时,只需处理好特殊字符即可.另外,必须用 (") 而非 (') 表示字符串: 复制代码 代码如下: static String string2Json(String s) { StringBuilder s

  • 解析JSON对象与字符串之间的相互转换

    在开发的过程中,如果对于少量参数的前后台传递,可以直接采用ajax的data函数,按json格式传递,后台Request即可,但有的时候,需要传递多个参数,这样后台 接受的时候Request多个很麻烦,此时要按照类的格式或者 集合的形式进行传递. 例如:前台按类的格式传递JSON对象: var jsonUserInfo = "{\"TUserName\":\"" + userName + "\",\"TInterest\&qu

  • PHP中使用json数据格式定义字面量对象的方法

    PHPer都知道PHP是不支持字面量了,至少目前版本都不支持.比如,在JS中可以这样定义object 复制代码 代码如下: var o = { 'name' : 'qttc' , 'url' : 'www.jb51.net' }; alert(o.name); Python中定义字典,也可以这样定义: 复制代码 代码如下: o = { 'name' : 'qttc' , 'url' : 'www.jb51.net' } print o['name'] 但在PHP中这么定义object: 复制代码

随机推荐