Ajax 实现方式

稻田里展望者

于 2022-03-23 22:03:18 发布

阅读量54

点赞数 2

分类专栏： Web前端技术 javaWeb 文章标签： Ajax

本文链接：https://blog.csdn.net/weixin_46441425/article/details/123697788

版权

javaWeb 同时被 2 个专栏收录

94 篇文章 3 订阅

订阅专栏

Web前端技术

86 篇文章 3 订阅

订阅专栏

html页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ajax</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        //定义方法
        function fun() {
            //使用$.Ajax()发送异步请求
            $.ajax({
                url:"ajaxServlet",//请求的路径
                type:"Post",//请求方式
                data:{"username":"jack","age":123},//请求参数
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
            });
        }
    </script>
</head>
<body>

    <input type="button" value="发送异步请求" onclick="fun();">
</body>
</html>

AjaxServlet 类

package servlet;

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 java.io.IOException;

@WebServlet("/ajaxServlet")
public class AjaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        //获取请求参数
        String username = request.getParameter("username");

        //打印username
        System.out.println(username);

        //响应
        response.getWriter().write("hello:"+username);
    }

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