ajaxl利用json 传送数据的 三种提交方式?
一、在servlet类中添加几个javabean对象,放置数据。
package com.aaa.servlet; import java.io.IOException;
import java.util.ArrayList;
import java.util.List; 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 com.aaa.entity.User;
import com.alibaba.fastjson.JSON; @WebServlet("/DemoServlet")
public class DemoServlet extends HttpServlet { public DemoServlet() {
super(); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); List<User>list=new ArrayList<>(); User u1 = new User(1,"哈哈","565");
User u2 = new User(1,"嘻嘻","666");
User u3 = new User(1,"吉吉","999"); list.add(u1);
list.add(u2);
list.add(u3); //将制定的对象 ,转换成json对象 String result=JSON.toJSONString(list);
response.getWriter().write(result); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
} }
二、创建jsp文件
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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>
</head> <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript">
/*
ajax利用json进行数据传送的三种方式?
1.导入jQuery 包
2.导入三个jar包 1.fastjson-1.2.9.jar 2.taglibs-standard-impl-1.2.5.jar 3.taglibs-standard-spec-1.2.5.jar 三个参数 1跳转到后台的URL地址 2.需要向跳转的后台servlet传递的参数
3.回调函数,用户接受收后台响应过来的对象 backdate status xmlhttpreque */
function getTestGet(){
$.get(
"<c:url value='/DemoServlet'/>", // 需要跳转到后台的URL地址
{"name":"test"}, // 需要向跳转到后台的servlet传递的参数
function(backData,status,xmlHttpRequest){ //回调函数 //得到本次ajax请求响应的文本内容
var result=eval(backData); alert(result[2].password);
alert(status+"----status");
alert(xmlHttpRequest+"---");
}); }
//2.post 的提交方式
function getTestPost(){
$.post(
"<c:url value='/DemoServlet'/>",
{"name":"test"},
function(backData,status,xmlHttpRequest){
//回调函数的函数体 用于解析异步请求的servlet响应过来的信息内容
alert(backData[0].username);
alert(status+"--status");
//得到本次ajax请求响应的文本内容和 backdate相似
//xmlhttprequest 不需要参数时 可以省略
alert(xmlHttpRequest.rsponseText+"---");
},"json");
} //3.ajax 的提交方式 function getTestAjax(){
$.ajax({
type:"get",
url:"<c:url value='DemoServlet'/>",
dataType:"json",
success:function(backData,status,xmlHttpRequst){
//类似于 foreach 便利的作用。
$.each(backData,function(i,u){
alert(i+"--"+u.username+"---"+u.password);
});
},
error:function(xmlHttpRequest,status,errorThrown){
alert("出错了!");
}
});
} </script>
<body>
<input type="button" onclick="getTestGet();" value="get的提交方式"/>
<input type="button" onclick="getTestPost();" value="post的提交方式"/>
<input type="button" onclick="getTestAjax();" value="ajax"/>
</body>
</html>
ajaxl利用json 传送数据的 三种提交方式?的更多相关文章
- .NET的JSON格式数据的三种转换方式
说明: 1..Net进行JSON格式的数据传递的时候,势必用到序列化和反序列化对象,总共有三种方式可是在.NET中实现序列化和反序列化的需求. 2.操作JSON的速度是:Json.net > M ...
- Docker与数据:三种挂载方式
操作系统与存储 操作系统中将存储定义为 Volume(卷) ,这是对物理存储的逻辑抽象,以达到对物理存储提供有弹性的分割方式.另外,将外部存储关联到操作系统的动作定义为 Mount(挂载). Dock ...
- python爬虫之数据的三种解析方式
一.正则解析 单字符: . : 除换行以外所有字符 [] :[aoe] [a-w] 匹配集合中任意一个字符 \d :数字 [0-9] \D : 非数字 \w :数字.字母.下划线.中文 \W : 非\ ...
- axios POST提交数据的三种请求方式写法
1.Content-Type: application/json import axios from 'axios' let data = {"code":"1234&q ...
- axios post提交数据的三种请求方式
1.Content-Type: application/json import axios from 'axios' let data = {"code":"1234&q ...
- form表单4种提交方式
<!DOCTYPE html><html> <head> <title>JavaScript表单提交四种方式</title> <met ...
- Linux就这个范儿 第15章 七种武器 linux 同步IO: sync、fsync与fdatasync Linux中的内存大页面huge page/large page David Cutler Linux读写内存数据的三种方式
Linux就这个范儿 第15章 七种武器 linux 同步IO: sync.fsync与fdatasync Linux中的内存大页面huge page/large page David Cut ...
- jQuery中通过JSONP来跨域获取数据的三种方式
第一种方法是在ajax函数中设置dataType为'jsonp' $.ajax({ dataType: 'jsonp', url: 'http://www.a.com/user?id=123', su ...
- ios网络学习------4 UIWebView的加载本地数据的三种方式
ios网络学习------4 UIWebView的加载本地数据的三种方式 分类: IOS2014-06-27 12:56 959人阅读 评论(0) 收藏 举报 UIWebView是IOS内置的浏览器, ...
随机推荐
- Interesting Fibonacci(hdu 2814)
Interesting Fibonacci Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Ot ...
- Oracle VirtualBox 配置宿主机与虚拟机互访
写作原因 之前经常使用 VMware Workstation Pro,由于是非正常付费使用的不打算再用了.替代品就是 Oracle VirtualBox,但是发现了一个问题: "我想用NAT ...
- Java中PO、DO、DTO、 VO、 BO、POJO 、DAO、TO的概念
1. PO(persistant object) 持久对象 在 O/R 映射的时候出现的概念,如果没有 O/R 映射,没有这个概念存在了. 通常对应数据模型 ( 数据库 ), 本身还有部分业务逻辑的 ...
- Chapter 1 A Definition of Causal Effect
目录 1.1 Individual casual effects 1.2 Average casual effects 1.5 Causation versus association Hern\(\ ...
- # 中文NER的那些事儿6. NER新范式!你问我答之MRC
就像Transformer带火了"XX is all you need"的论文起名大法,最近也看到了好多"Unified XX Framework for XX" ...
- 台湾旺玖MA8601|USB HUB方案|MA8601测试版
MA8601是USB 2.0高速4端口集线器控制器的高性能解决方案,完全符合通用串行总线规范2.0.MA8601继承了先进的串行接口技术,当4个DS(下游)端口同时工作时,功耗最低. MA8601采用 ...
- Linux 中安装、升级、配置 Swoole 扩展
从源码编译安装 # 下载Swoole wget http://pecl.php.net/get/swoole-4.5.2.tgz tar -zxvf swoole-4.5.2.tgz cd swool ...
- minio文件上传与下载
目录 一.minio简介 二.minio安装 一.java中使用 一.minio简介 MinIO 是在 GNU Affero 通用公共许可证 v3.0 下发布的高性能对象存储. 它是与 Amazon ...
- Postman保存token并使用token的整个流程
1. 调通获取token的接口,包含传递参数的类型,和输入密码是否需要md5加密,根据接口的要求,传入数据 2. 查看接口响应的报文,可以看到token的有效时间,token的类型,里面的access ...
- Chrome - XPath Helper插件 使用手工拖拽方式无法正常安装的解决办法
安装前准备: (1)下载 XPath Helper资源: 链接: https://pan.baidu.com/s/1yEnngIJz8fT9fNv3aHhs7w 提取码: afy3 (2)Chrome ...