一、在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】382. Linked List Random Node 解题报告（Python & C++）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 数组保存再随机选择 蓄水池抽样 日期 题目地址:ht ...

  2. LeetCode 第三大的数414. Third Maximum Number

    题目 描述:给定数组中求第三大的数字:如果没有,返回最大的:时间复杂度O(n) 记得<剑指offer>才看到过这样的求第k大的题目.但是忘记具体怎么做了.只好先自己想了. 因为时间复杂度的 ...

  3. 【】二次通告--Apache log4j-2.15.0-rc1版本存在绕过风险，请广大用户尽快更新版本

    [转载自360众测] Apache Log4j2是一个基于Java的日志记录工具.该工具重写了Log4j框架,并且引入了大量丰富的特性.我们可以控制日志信息输送的目的地为控制台.文件.GUI组件等,通 ...

  4. 如何改善win10录屏时声音降噪（消除杂音）

    此文章是针对win10系统中安装Realtek声卡的麦克风出现杂音的设置办法 1. 打开win10的控制面板,找到"硬件和声音选项" 2. 进入"硬件和声音"选 ...

  5. Git从远程仓库克隆

    首先,登陆GitHub,创建一个新的仓库,名字叫gitskills 勾选Initialize this repository with a README,这样GitHub会自动为我们创建一个READM ...

  6. 使用.NET 6开发TodoList应用(12)——实现ActionFilter

    系列导航及源代码 使用.NET 6开发TodoList应用文章索引 需求 Filter在.NET Web API项目开发中也是很重要的一个概念,它运行在执行MVC响应的Pipeline中执行,允许我们 ...

  7. oralce索引的使用

    1.索引的作用 数据库对象 用于提高数据库检索的效率,对于where,group,order by条件中经常出现的字段,创建索引可以加快效率 缺点:如果对于大量的数据插入时效率可能会变低 2.索引的使 ...

  8. 简单的 Shell 脚本入门教程

    Shell脚本 运作方式与解释型语言相当,如果有语言基础,学起 Shell 脚本就非常容易,但是 Shell 与常见的语言不同,一些常见的函数在 Shell 中需要组合一些命令得以实现 工具推荐 Sh ...

  9. 初识python 之 自动拆分转换文本内容

    上一篇升级版,转换文件内容. #!/user/bin env python # author:Simple-Sir # time:2021/7/9 23:32 def txt_2_list(filen ...

  10. JMeter_分布式压测配置

    前置条件 电脑A,电脑B,电脑C均安装相同版本的JMeter 和JDK.其中电脑A作为控制机,电脑B和电脑C作为施压机 电脑A IP:172.16.0.114 电脑B IP:172.16.0.115 ...