jQuery结合Thymeleaf模板中的fragment标签实现Ajax异步加载数据

前端页面

一、首先、在需要异步刷新的div上面定义fragment片段

<div th:fragment="fragmentSegment">
     需要异步刷新的div
</div>

二、主动加载数据

<script type="text/javascript" th:inline="javascript">
    // 异步刷新
    $(function () {
        $("#comment-container").load(/*[[@{/服务器的请求地址}]]*/"");
    });

</script>

三、被动加载——写成一个函数

<script type="text/javascript" th:inline="javascript">
    function postData() {
        $("#fragmentSegment").load(/*[[@{/服务器请求地址}]]*/"", {
            // 可携带参数
        }, function (responseTxt, statusTxt, xhr) {
            // 回调函数
        });
    }
</script>

后台

Controller层

@Controller
public class getDataController {
    
    @PostMapping("/请求url")
    public String getData() {
        return "路径/页面名称 :: 当前页面的fragment片段名称";
    }
}