JAVAWeb对ajax中get与post的使用

JAVAWeb对ajax中get与post的使用

01.使用背景及ajax的介绍

在进行javaWeb的开发中难免会遇到异步请求的情况,为了使网站局部的信息发生变化,而不影响整个页面的话,博主知道的也只用ajax了。AJAX 是一种与服务器交换数据的技术,可以在不重新载入整个页面的情况下更新网页的一部分。需要注意的是:本博文是基于jQuery对ajax进行操作。

02.ajax的一些属性

博主使用最多的文档就是查询这个网址(http://www.runoob.com/jquery/jquery-ref-ajax.html
个人在开发中,使用最多的也就是post和get请求,这两者之间的区别,对于做过开发的人员来说就不用解释,具体区别可查看博文(https://blog.csdn.net/qq_36030288/article/details/52755798)。

03.使用案例

03.1.基本介绍

$.get() 方法通过 HTTP GET 请求从服务器上请求数据。
语法:$.get(URL,callback);
其中:URL是必须的参数,是提交数据的地址,callback包括请求成功后的函数,及相应可选的返回数据。
$.post() 方法通过 HTTP POST 请求向服务器提交数据。
语法:$.post(URL,data,callback);
其中:必需的 URL 参数规定您希望请求的 URL。可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。

03.2.代码详解

前端:

<%@ 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">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
<script>
$(function(){
    //执行第一个按钮
    $("#btn1").click(function(){
        //使用get方式发送请求
        $.get("${pageContext.request.contextPath }/ajax?para=test01&content=test02",function(data){
            $(data).each(function(){
                alert("数据:"+this);
            });
        },"json");
    });
    //执行第二个按钮
    $("#btn2").click(function(){
            $.post("${pageContext.request.contextPath }/ajax",{
                //要发送的数据
                para:"test01",
                content:"test02"
            },
            //执行返回的数据
                function(data,status){
                alert("数据: \n" + data + "\n状态: " + status);
            },"json");
    });
});
</script>
</head>
<body>
<button id="btn1">发送一个 HTTP GET 请求并获取返回结果</button><br><br>
<button id="btn2">发送一个 HTTP Post 请求并获取返回结果</button>
</body>
</html>

后端:

package cn.study.Servlet;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

/**
 * Servlet implementation class AjaxServlet
 */
public class AjaxServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String data01 = request.getParameter("para");
        String data02 = request.getParameter("content");
        System.out.println(data01+"--"+data02);
        List<String> list=new ArrayList<String>();
        list.add(data01);
        list.add(data02);
        list.add("success");
        //将list封装成json
        String listJson=JSONArray.fromObject(list).toString();

        //写回去
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().println(listJson);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        this.doGet(request, response);
    }

}

03.3.代码运行结果

这里写图片描述
这里写图片描述

04.总结

对于ajax的使用还有很多方式,具体的可以参见w3cschool等,如http://www.runoob.com/jquery/jquery-ajax-intro.html
本测试的源码可见百度云网盘:链接:https://pan.baidu.com/s/17BwbCRSolLL-osWcM27INg 密码:9rbv

猜你喜欢

转载自blog.csdn.net/meiqi0538/article/details/79815122