jquery ajax ajax()

最新推荐文章于 2020-10-14 22:23:34 发布

o_瓜田李下_o

最新推荐文章于 2020-10-14 22:23:34 发布

阅读量180

点赞数

分类专栏： jquery

本文链接：https://blog.csdn.net/weixin_43931625/article/details/107748057

版权

jquery 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

jquery ajax ajax()

应用：ajax()是jquery ajax底层实现，其他的ajax提交方式都可以通过ajax()实现

*******************

语法：ajax(options)

options选项

url：请求地址

type：请求方式，get（默认）、post

timeout：请求超时时间

data：向请求地址传递的数据

dataType：服务器返回的数据类型

beforeSend：ajax请求发送前执行的回调参数，函数参数：xmlHttpRequest

complete：请求发送完成（响应失败、成功都会调用）执行的回调参数，函数参数：responseText、status、xmlHttpRequest

success：响应成功调用，函数参数：responseText、status、xmlHttpRequest

error：响应失败调用，函数参数：errorThrown、status（errorThrown、status只有一个包含信息）、xmlHttpRequest

global：是否触发全局ajax事件，true（默认）、false（不触发全局事件）

*******************

示例

HelloController

@RestController
public class HelloController {

    @RequestMapping("/hello")
    public String hello(){
        return "hello 瓜田李下";
    }

    @RequestMapping("/hello2")
    public String hello2(String name){

        return "hello "+name;
    }
}

index.html

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/jquery/jquery-3.5.1.min.js"></script>
</head>
<script>
    $(function () {
        $("#btn").click(function () {
            $.ajax({
                url: "/hello2",
                data: {
                    name: "瓜田李下"
                },
                success: function (data) {
                    $("span").html("<strong style='color: orange'>"+data+"</strong><br>")
                }
            })
        })
    })
</script>
<body>
<div th:align="center">
    <span></span>
    <button id="btn">加载数据</button>
</div>
</body>
</html>

点击按钮