ajax

最新推荐文章于 2024-07-20 23:55:03 发布

ahao4311

最新推荐文章于 2024-07-20 23:55:03 发布

阅读量99

点赞数

文章标签： java json javascript ViewUI

原文链接：http://www.cnblogs.com/wzhsc/p/10415139.html

版权

什么是ajax

异步的javaScript 和 xml

1、异步和同步：在客户端和服务器互相通信的基础上

同步：客户端必须等待服务器的响应，在等待期间不能做其他操作

异步：客户端不必等待服务器的响应，在期间能做其他操作

2、Ajax是一种无需重新加载整个网页的情况下，可以更新部分网页的技术

jQuery可以通过三种方式进行数据的传值

$.post()：jQuery.post(url, [data], [callback], [type])

$.get()：jQuery.get(url, [data], [callback], [type])

$.ajax({})：jQuery.ajax(url,[settings])

属性：

ur：待载入页面的URL地址

data：待发送 Key/value 参数

callback：载入成功时回调函数

type：返回内容格式，xml, html, script, json, text, _default

案例

servlet类

package com.xmcc.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");
        System.out.println(username);

        String age = request.getParameter("age");
        System.out.println(age);
        response.getWriter().write("ssssssss");

    }

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

jsp页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script src="js/jquery-3.3.1.min.js"></script>

<script>
    //字符串拼接
        function aaa() {
            //使用ajax提交请求
            $.ajax({
                url:"/ajaxServlet",
                data:"username=coco&age=12",
                type:"POST",
                success:function (obj) {
                    alert(obj)
                }
            })
        }

        //json格式
        function bbb() {
            //使用ajax提交请求
            $.ajax({
                url:"/ajaxServlet",
                data:{"username":"coco","age":12},
                type:"POST",
                success:function (obj) {
                    alert(obj)
                },
                error:function () {
                    alert("111111111111")
                },
                //服务器响应的数据格式
                dataType:"text"
            })
        }

    function ccc() {
        //使用$.get()提交请求
        $.get("/ajaxServlet","username=coco",function (obj) {
            alert(obj)
        },"text")

        //使用$.post()提交请求
        $.post("/ajaxServlet","username=coco",function (obj) {
            alert(obj)
        },"text")

    }

</script>
<html>
<head>
    <title>Title</title>
</head>
<body>

<button id="btn" οnclick="aaa()">点击1</button>

<button id="btn" οnclick="bbb()">点击2</button>

<button id="btn" οnclick="ccc()">点击3</button> 

</body>
</html>

转载于:https://www.cnblogs.com/wzhsc/p/10415139.html

ahao4311

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax

什么是ajax异步的javaScript 和 xml1、异步和同步：在客户端和服务器互相通信的基础上同步：客户端必须等待服务器的响应，在等待期间不能做其他操作异步：客户端不必等待服务器的响应，在期间能做其他操作2、Ajax是一种无需重新加载整个网页的情况下，可以更新部分网页的技术jQuery可以通过三种方式进行数据的传值$.post()：jQuery.post...
复制链接

扫一扫

ajax

“相关推荐”对你有帮助么？