thymeleaf异步刷新

原创

于 2023-08-28 15:49:18 发布 · 620 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #Thymeleaf

文章讲述了在开发中实现置顶和取消置顶功能时，为了避免频繁的window.location.reload()造成的服务器资源消耗，采用异步刷新和事件委托技术。Java控制器中通过Ajax请求处理置顶和取消置顶逻辑，并确保功能在页面动态刷新时仍能正常工作。

业务描述：开发置顶功能时，需要利用后台的数据判断当前需要置顶或取消置顶，类似于关注和取消关注的功能，但该功能的页面复杂，以window.location.reload();的方式过于消耗服务器资源，因此采用了异步刷新的方式处理

html

<!-- 父级元素，不受异步刷新影响-->
<div id="buttonsContainer">
 <input type="hidden" id="postId" th:value="${post.id}">
 <!-- th:fragment html模板-用于异步刷新-->
 <div id="postTop" th:fragment="postTop">
  <input type="hidden" id="postType" th:value=