一、在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 传送数据的 三种提交方式？的更多相关文章

  1. .NET的JSON格式数据的三种转换方式

    说明: 1..Net进行JSON格式的数据传递的时候,势必用到序列化和反序列化对象,总共有三种方式可是在.NET中实现序列化和反序列化的需求. 2.操作JSON的速度是:Json.net > M ...

  2. Docker与数据：三种挂载方式

    操作系统与存储 操作系统中将存储定义为 Volume(卷) ,这是对物理存储的逻辑抽象,以达到对物理存储提供有弹性的分割方式.另外,将外部存储关联到操作系统的动作定义为 Mount(挂载). Dock ...

  3. python爬虫之数据的三种解析方式

    一.正则解析 单字符: . : 除换行以外所有字符 [] :[aoe] [a-w] 匹配集合中任意一个字符 \d :数字 [0-9] \D : 非数字 \w :数字.字母.下划线.中文 \W : 非\ ...

  4. axios POST提交数据的三种请求方式写法

    1.Content-Type: application/json import axios from 'axios' let data = {"code":"1234&q ...

  5. axios post提交数据的三种请求方式

    1.Content-Type: application/json import axios from 'axios' let data = {"code":"1234&q ...

  6. form表单4种提交方式

    <!DOCTYPE html><html> <head> <title>JavaScript表单提交四种方式</title> <met ...

  7. 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 ...

  8. jQuery中通过JSONP来跨域获取数据的三种方式

    第一种方法是在ajax函数中设置dataType为'jsonp' $.ajax({ dataType: 'jsonp', url: 'http://www.a.com/user?id=123', su ...

  9. ios网络学习------4 UIWebView的加载本地数据的三种方式

    ios网络学习------4 UIWebView的加载本地数据的三种方式 分类: IOS2014-06-27 12:56 959人阅读 评论(0) 收藏 举报 UIWebView是IOS内置的浏览器, ...

随机推荐

  1. 【LeetCode】884. Uncommon Words from Two Sentences 解题报告（Python）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 字典统计 日期 题目地址:https://leetc ...

  2. YAPTCHA(hdu2973)

    YAPTCHA Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  3. 主流的 API 架构

    1. RPC:调用另一个系统的函数 2. SOAP:使数据作为服务可用 3. REST:使数据作为资源可用 4. GraphQL:仅请求所需要的数据 1. RPC:调用另一个系统的函数 远程过程调用是 ...

  4. Loss Landscape Sightseeing with Multi-Point Optimization

    目录 概 主要内容 代码 Skorokhodov I, Burtsev M. Loss Landscape Sightseeing with Multi-Point Optimization.[J]. ...

  5. matplotlib 进阶之Tight Layout guide

    目录 简单的例子 Use with GridSpec Legend and Annotations Use with AxesGrid1 Colorbar 函数链接 matplotlib教程学习笔记 ...

  6. [opencv]拼接合并轮廓集合mergeContours

    /** * 拼接合并轮廓集合 * @param contours * @return */ vector<vector<Point>> mergeContours(vector ...

  7. Linux搜索查找类

    find find将从指定目录下递归地遍历各个子目录,将满足条件的文件或目录显示在终端,如果没有则不显示 基本语法 find 搜索范围 [选项] 选项说明 选项 功能 -name 按照文件名查找 -u ...

  8. 部署Kubernetes Cluster

    中文学习网站:https://www.kubernetes.org.cn/doc-16 部署docker服务 所有节点部署docker服务 curl -sSL https://get.daocloud ...

  9. 物理CPU，物理CPU内核，逻辑CPU概念详解

    1.说明 CPU(Central Processing Unit)是中央处理单元, 本文介绍物理CPU,物理CPU内核,逻辑CPU, 以及他们三者之间的关系, 一个物理CPU可以有1个或者多个物理内核 ...

  10. Selenium_使用execute_script执行JavaScript（11）

    selenium的包含的方法已能完全满足UI自动化,但是有些时候又不得不用到执行JS的情况,比如在一个富文本框中输入1W个字,使用send_keys方法将经历漫长的输入过程,如果换成使用JS的inne ...