java ajax json 前后端数据传输

最新推荐文章于 2024-05-16 13:56:10 发布
最新推荐文章于 2024-05-16 13:56:10 发布
阅读量1.5k 收藏 5
点赞数
分类专栏： jQuery 文章标签： 数据 json 对象
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38234785/article/details/76687496
版权

传输单个对象

example.java

package example;
import servlet.*;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSON;
import net.sf.json.JSONObject;

/**
 * Servlet implementation class example
 */
@WebServlet("/example")
public class example extends HttpServlet {
	private static final long serialVersionUID = 1L;

    public example() {
        super();
    }


	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doPost(request, response);
	}


	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		people p=new people("张三", "123");
		
		JSONObject obj=new JSONObject();
		obj.put("message",p.getMessage());
		obj.put("time", p.getTime());
		
		JSONObject firstp=new JSONObject();
		firstp.put("obj",obj);
		
		response.getWriter().append(firstp.toString());
	}

}

index.jsp 

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!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">
<script src="js/jquery.min.js"></script>
	    <script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	    <script src="js/my.js" type="text/javascript" charset="utf-8"></script>
	    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
	    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css"/>
	    <link rel="stylesheet" type="text/css" href="css/my.css"/>
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$.ajax({
        url:"example/example",
        data:{},
        type:"POST",
        dataType:"JSON",
        success:function(httpdata){
        	$("#a").append("<li>"+httpdata.obj.message+"</li>");
            $("#a").append("<li>"+httpdata.obj.time+"</li>");
        }
    })
});
</script>
</head>
<body>
<ul id="a"></ul>

</body>
</html>

web.xml插入如下代码 

<servlet>
    <servlet-name>example</servlet-name>
    <servlet-class>example.example</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>example</servlet-name>
    <url-pattern>/example/example</url-pattern>
  </servlet-mapping>

传输多个对象


example.java

package example;
import servlet.*;
import java.io.IOException;
import java.util.ArrayList;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSON;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;

/**
 * Servlet implementation class example
 */
@WebServlet("/example")
public class example extends HttpServlet {
	private static final long serialVersionUID = 1L;

    public example() {
        super();
    }


	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doPost(request, response);
	}


	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		people p1=new people("zhangsan", "123");
		people p2=new people("lisi", "123324345");
		people p3=new people("wangwu", "332123");
		ArrayList<people> list=new ArrayList<people>();
		list.add(p1);
		list.add(p2);
		list.add(p3);
		
		JSONArray arr=new JSONArray();
		for(people p: list)
		{
			JSONObject obj=new JSONObject();
			obj.put("message",p.getMessage());
			obj.put("time",p.getTime());
			arr.add(obj);
		}
		response.getWriter().append(arr.toString());
	}

}


index.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!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">
<script src="js/jquery.min.js"></script>
	    <script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	    <script src="js/my.js" type="text/javascript" charset="utf-8"></script>
	    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
	    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css"/>
	    <link rel="stylesheet" type="text/css" href="css/my.css"/>
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$.ajax({
        url:"example/example",
        data:{},
        type:"POST",
        dataType:"JSON",
        success:function(httpdata){
        	 for(var i=0;i<httpdata.length;i++){
                 var n=httpdata[i].message
                 var a=httpdata[i].time
                 var tr="<tr>"
                     tr+="<td>"+n+"</td>"
                     tr+="<td>"+a+"</td>"
                     tr+="</tr>"
                     $("#a").append(tr)
             }    
        }
    })
});
</script>
</head>
<body>
<table width="100%" id="a" border="1px">
</table>

</body>
</html>






不染心
关注
  • 0
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
java对象转Json AjaxJson数据交换 需要用到的所有包
07-04
里面有好几个jar包 全部拷贝到工程里头就可以 很方便的进行对象转json了 和AjaxJson数据交换
java Ajax
热门推荐
Xiebo030212的博客
05-02 4万+
Ajax的介绍和使用 什么是Ajax 实例（搜索关键字，出来下拉框） index.jsp SearchServlet 什么是Ajax Ajax 全名 async javascript and XML(异步JavaScript和XML) 是前后台交互的方法，也就是我们客户端给服务端发送消息的⼯具，以及接受响应的⼯具 Ajax是在不重新加载整个页面的状态下与服务器交换数据并更新部分网页的技术 是一个默认异步执行机制的方法（同步：async=false，异步：async=true） 同步请求（async=fals
ajax+json进行数据传输请求（ssm框架）_前后端的数据传递,建议采用json+ajax请求方式
最新发布
2401_85014148的博客
05-16 261
a）我们设置的方法为，只要点击“id=b1”的按钮，就会触发这个函数。代码如下（test.jsp，目录在webapp下）代码如下（TestController.java）1.3 controller写法。c）ajax要发送好几个数据。来注解方法，并封装JSON。1.2 前端发送ajax请求。这样，引入后就可以直接使用。
初学Ajax
山水缘
12-14 106
一、开门见山     这些时间，瞎子也看得见，AJAX正大踏步的朝我们走来。不管我们是拥护也好，反对也罢，还是视而不见，AJAX像一阵潮流，席转了我们所有的人。     关于AJAX的定义也好，大话也好，早有人在网上发表了汗牛充栋的文字，在这里我也不想照本宣科。     只想说说我感觉到的一些优点，对于不对，大家也可以和我讨论：     首先是异步交互，用户感觉不到页面的提交，当然也不等待页面...
JAVA 之 Ajax
qq_53312143的博客
11-01 1万+
Java Ajax 异步交互
AJAX&&JSON
chenguoao1999的博客
09-13 580
课程笔记Day46 AJAX JSON 综合案例 第一章 AJAX 第01节 基础理论 1、概念说明 1. 什么是 AJAX ? AJAX是一项技术合集。他是由一套技术组合得到的新技术方案。 异步请求技术 2. AJAX有什么作用呢? 使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上， 而不需要重载（刷新）整个页面，这使得程序能够更快地回应用户的操作。 3. 异步和同步的概念说明? A. 异步: 多个操作是相互独立的过程, 各自完成各自的操作,互不影响。 B. 同步: 多个操
ajax用json实现数据传输
12-12
JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C、C++、C#、Java、JavaScript、Perl、Python等）。这些特性使JSON成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和...
Ajax中使用JSON传输数据
03-06
JSON（JavaScript Object Notation）作为一种轻量级的数据交换格式，因其易读性、易写性和高效性，成为了Ajax通信中数据传输的首选格式。本篇文章将深入探讨在Ajax中如何使用JSON来传输数据，以及涉及到的相关工具和...
JAVA实现JSON后端向前端传递数据
10-20
在Java开发中，后端与前端的数据交互通常涉及到JSON（JavaScript Object Notation）格式，因为JSON是一种轻量级的数据交换格式，易于...这样的方式能够确保数据传输的安全性和一致性，同时方便前后端的交互和错误处理。
jQuery Ajax前后端使用JSON进行交互示例
11-28
在本文中，我们将深入探讨如何使用jQuery的Ajax功能与后端服务器进行JSON数据的交互，以实现前后端的通信。这个示例将演示一个简单的用户ID验证场景，其中前端发送包含用户ID和性别的JSON对象到后端，后端接收到数据...
springboot-ajax前后端交互项目
05-22
**Spring Boot AJAX 前后端交互项目** 在现代Web应用开发中，Spring Boot和AJAX技术的结合是实现高效、动态用户界面的关键。本项目旨在演示如何利用Spring Boot作为后端服务，与前端通过AJAX进行数据交换，提供流畅...
java ajax传值到后台_Json实现传值到后台代码实例
weixin_29184371的博客
02-23 358
1.定义一个键值对对象function ObjData(key,value){this.Key=key;this.Value=value;}2.在点击表单的提交buttom的方法中：var list=document.getElementById("myForm").getElementsByTagName("input");//查询form下的所有input标签var array=[]; //定...
java 后台实现ajax post跨域请求传递json格式数据获取json数据问题
weixin_30426065的博客
04-25 427
参考大神：http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台： public String ajaxProxy(Integer param1,String param2,String url, HttpServletRequest req){ JSONObject node = n...
JavaWeb----Ajax技术
11-28 1005
JSON(JavaScript Object Notation) 是一种基于字符串的轻量级的数 据交换格式。易于阅 读和编写，同时也易于机器解析和生成。JSON 是 JavaScript 数据 类型的子集。
java转发ajax跨域访问,ajax 跨域 java 转发
weixin_42311427的博客
08-06 207
ajax 跨域 java 转发[2021-02-09 22:09:11]简介:php去除nbsp的方法：首先创建一个PHP代码示例文件；然后通过“preg_replace("/(\s|\&nbsp\;|　|\xc2\xa0)/", " ", strip_tags($val));”方法去除所有nbsp即可。推荐：《PHP视频教ajax跨域问题的解决方法：1、响应头添加Header允许访问...
java中Ajax的使用
萧十一郎博客
06-22 4378
Ajax：  （Asynchronous JavaScript and XML）异步的javascript与xml技术           通过异步请求 不刷新页面的情况下通过javascript与服务器端进行通讯                可以达到页面的局部刷新          异步-》          多个执行或者同时执行 同步-》          按照一定
java 通过Ajax前台传参数 并用 HttpURLConnection Post方式访问对外的接口
阿飞云漫步
10-23 1万+
前两天做项目遇到一个问题，就是在自己的项目中要去访问项目外部的接口，从自己的项目中传参数过去，通过调用 对方提供的接口去获取想要得到的数据！第一次接触到在自己项目中去访问和调用外部的资源，然后在网上去找资料，看有没有相关的资料可以参考，然后通过参考其他人的博客资料，最终把这个问题解决了。自己总结一下这个过程，也供遇到相同或者类似问题的朋友可以快速的定位和解决问题。      下面讲一下我的问题和
【Javaweb】Ajax
weixin_46303867的博客
02-07 217
修改时间：2021年2月7日 作者：pp_x 邮箱：pp_x12138@163.com Ajax 传统网页更新数据 传统的网页如果需要更新内容，必须重载整个网页页面。每当用户向服务器发送请求，哪怕只是需要更新一点点的局部内容，服务器都会将整个页面进行刷新。这种方式的缺点是: 性能会有所降低 (一点内容，刷新整个页面！) 用户的操作页面会中断(整个页面被刷新了) 什么是Ajax Ajax 即**“Asynchronous Javascript And XML”，是指一种创建交互式网页应用
java中ajax的用途_Ajax在java前台中怎么运用
weixin_32098487的博客
02-13 169
ajax技术的目的是让javascript发送http请求，与后台通信，获取数据和信息。ajax技术的原理是实例化xmlhttp对象，使用此对象与后台通信。ajax通信的过程不会影响后续javascript的执行，从而实现异步。下面例子.分页ajax 应用function fenye(cpage) {location = "/list?cpage="+cpage;}function qx(){$(...
Java如何实现前后端分离
04-26
4. GraphQL：GraphQL是一种用于API的查询语言和运行时环境，可以有效地解决前后端数据传输的问题。Java后端可以使用GraphQL来定义数据模型和查询接口，前端通过发送GraphQL查询请求获取需要的数据。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不染心

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值