本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议
》和
《
阿里云开发者社区知识产权保护指引
》。如果您发现本社区中有涉嫌抄袭的内容,填写
侵权投诉表单
进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。
package com.example.demo.thymeleaf;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
@Controller
@RequestMapping("/refresh")
public class IndexController {
@RequestMapping
public String globalRefresh(Model model) {
List<Map<String,String>> lists = new ArrayList<>();
Map<String,String> map = new HashMap<>();
map.put("author", "曹雪芹");
map.put("title", "《红楼梦》");
map.put("url", "www.baidu.com");
lists.add(map);
// 用作对照
model.addAttribute("refresh", "我不会被刷新");
model.addAttribute("title", "我的书单");
model.addAttribute("books", lists);
return "test";
* 局部刷新,注意返回值
* @param model
* @return
@RequestMapping("/local")
public String localRefresh(Model model) {
List<Map<String,String>> lists = new ArrayList<>();
Map<String,String> map = new HashMap<>();
map.put("author", "罗贯中");
map.put("title", "《三国演义》");
map.put("url", "www.baidu.com");
lists.add(map);
model.addAttribute("title", "我的书单");
model.addAttribute("books", lists);
// "test"是test.html的名,
// "table_refresh"是test.html中需要刷新的部分标志,
// 在标签里加入:th:fragment="table_refresh"
return "test::table_refresh";
<title>thymeleaf局部刷新</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
</head>
<span style="margin:0 auto;font-size: 26px" th:text="${refresh}"></span>
<button onClick="localRefresh()">点击刷新表格</button>
<!-- 需要局部刷新的部分,设置了th:fragment="table_refresh" -->
<div id="table_refresh" style="text-align: center;margin:0 auto;width: 900px" th:fragment="table_refresh">
<h1 th:text="${title}"></h1>
<table width="100%" border="1" cellspacing="1" cellpadding="0">
<td>Author</td>
<td>Book</td>
<td>Url</td>
<tr th:each="book : ${books}">
<td th:text="${book.author}"></td>
<td th:text="${book.title}"></td>
<td th:text="${book.url}"></td>
</table>
</body>
<script>
function localRefresh() {
// 装载局部刷新返回的页面
$('#table_refresh').load("/refresh/local");
</script>
</html>