JQuery方式的Ajax-load和getJson

最新推荐文章于 2022-12-07 18:01:22 发布

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

最新推荐文章于 2022-12-07 18:01:22 发布

阅读量217

点赞数

分类专栏： Java JSP

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

版权

Java 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

JSP

3 篇文章 0 订阅

订阅专栏

方法

$(xxx).load(
- 服务器地址
- 请求数据
- function(result){
  },
- “xml” 或 “json” 或 “text”
);
load：将服务端的返回值直接加载到$(xxx)所选择的元素中

案例

开发环境：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("/Mobile2Servlet")
public class Mobile2Servlet 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("此号码已存在");
        }else {
            out.write("注册成功");
        }
        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();
            $("#tip").load(
                "Mobile2Servlet",
                "mobile="+$mobile
            );
        }
    </script>
    <title>JQuery方式实现AJAX</title>
</head>
<body>
手机：<input id="mobile"/><br/>
<button type="button"  onclick="register()">注册</button>
<span id="tip"></span>
</body>
</html>

$.getJSON(
服务器地址
JSON格式的请求数据,
function(result){
}
);

案例

开发环境：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("/Mobile3Servlet")
public class Mobile3Servlet 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("{\"msg\":\"true\"}");
        }else {
            out.write("{\"msg\":\"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();
            $.getJSON(
                "Mobile3Servlet",
                {"mobile":$mobile},
                function (result) {
                    if (result.msg == "true"){
                        alert("已存在！注册失败！");
                    }else {
                        alert("注册成功！");
                    }
                }
            );
        }
    </script>
    <title>JQuery方式实现AJAX</title>
</head>
<body>
手机：<input id="mobile"/><br/>
<button type="button"  onclick="register()">注册</button>
<span id="tip"></span>
</body>
</html>

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

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery方式的Ajax-load和getJson

方法$(xxx).load(服务器地址请求数据function(result){},“xml” 或 “json” 或 “text”);load：将服务端的返回值直接加载到$(xxx)所选择的元素中案例开发环境：jsp、servlet、jquerypackage com.hyzd.servlet;import javax.servlet.ServletExcep...
复制链接

扫一扫