【推荐】JQuery方式实现Ajax-ajax、get、post

最新推荐文章于 2022-04-04 18:11:49 发布

不生气不生气要开心要开心

最新推荐文章于 2022-04-04 18:11:49 发布

阅读量124

点赞数

分类专栏： Java JSP

本文链接：https://blog.csdn.net/weixin_44098569/article/details/90138725

版权

Java 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

JSP

3 篇文章 0 订阅

订阅专栏

方法

$.ajax({
- url：服务器地址,
- 请求方式：get|pose,
- data：请求数据,
- success:function(result,testStatus) {
  },
- error:function(xhr,errorMessage,e){
  }
});

举例：

开发环境：jsp+servlet+jquery

package com.hyzd.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;
import java.io.PrintWriter;

@WebServlet("/MobileServlet")
public class MobileServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html; charset=UTF-8");
        String mobile = request.getParameter("mobile");
        //假设此时 数据库中只有一个号码 18574400000

        PrintWriter out = response.getWriter();
        if("18574400000".equals(mobile)) {
            out.write("true");//servlet以输出流的方式将信息返回给客户端
        }else {
            out.write("false");
        }
        out.close();
    }
}

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <script src="js/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        function register() {
            var $mobile = $("#mobile").val();
            $.ajax({
                url:"MobileServlet",
                请求方式:"post",
                data:"mobile="+$mobile,
                succcess:function(result,testStatus){
                    if (result=="true"){
                        alert("已存在！注册失败！");
                    }else {
                        alert("注册成功！");
                    }
                },
                error:function(xhr,errorMessage,e){
                    alert("系统异常！");
                }
            })
        };
    </script>
    <title>JQuery方式实现AJAX</title>
</head>
<body>
手机：<input id="mobile"/><br/>
<button type="button"  onclick="register()">注册</button>
</body>
</html>

$.get(
- 服务器地址
- 请求数据
- function(result){
  } ,
- 预期返回值类型(string\xml)
);

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
   <meta charset="UTF-8">
   <script src="js/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
   <script type="text/javascript">
       function register() {
           var $mobile = $("#mobile").val();
           $.get(
               "MobileServlet",
               "mobile="+$mobile,
               function (result) {
                   if (result=="true"){
                      alert("已存在！注册失败！");
                   }else {
                       alert("注册成功！");
                   }
               }
           );
       }
   </script>
   <title>JQuery方式实现AJAX</title>
</head>
<body>
手机：<input id="mobile"/><br/>
<button type="button"  onclick="register()">注册</button>
</body>
</html>

$.post(
- 服务器地址
- 请求数据
- function(result){
  } ,
- “xml” 或 “json” 或 “text”
);

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
   <meta charset="UTF-8">
   <script src="js/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
   <script type="text/javascript">
       function register() {
           var $mobile = $("#mobile").val();
           $.post(
               "MobileServlet",
               "mobile="+$mobile,
               function (result) {
                   if (result=="true"){
                      alert("已存在！注册失败！");
                   }else {
                       alert("注册成功！");
                   }
               },
               "text"
           );
       }
   </script>
   <title>JQuery方式实现AJAX</title>
</head>
<body>
手机：<input id="mobile"/><br/>
<button type="button"  onclick="register()">注册</button>
</body>
</html>

不生气不生气要开心要开心

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【推荐】JQuery方式实现Ajax-ajax、get、post

方法$.ajax({url：服务器地址,请求方式：get|pose,data：请求数据,success:function(result,testStatus) {},error:function(xhr,errorMessage,e){} });举例：开发环境：jsp+servlet+jquerypackage com.hyzd.servlet;import ...
复制链接

扫一扫