建立一个实体类：
public class Fruit {
int id;
String name;
public Fruit() {
}
public Fruit(int id, String name) {
this.id = id;
this.name = name;
}
//省略get和set方法
}
建立一个控制类：
package org.project.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.ArrayList;
import java.util.List;
@Controller
public class FruitController {
@RequestMapping("/fruit")
public String fruit(Model model){
return "fruit";
}
@RequestMapping("/fruit/detail")
public String detail(Model model,int id) {
List<Fruit> fruits = new ArrayList<>();
if(id == 0) {
String[] strings={"香蕉","苹果","凤梨","西瓜"};
for(int i = 1; i <= strings.length; i++) {
fruits.add(new Fruit(i,strings[i-1]));
}
} else if(id == 1) {
String[] strings={"菠萝","草莓","西红柿","黑莓","百香果","葡萄"};
for(int i = 1; i <= strings.length; i++) {
fruits.add(new Fruit(i,strings[i-1]));
}
}
model.addAttribute("fruits",fruits);
return "fruit::fruit-list";
}
}
前端代码：
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thyleaf</title>
<script type="text/javascript" src="/lib/jquery/1.9.1/jquery.min.js"></script>
<script>
function ceshi1() {
$('#fruit-list').load("/fruit/detail?id=0");
}
function ceshi2() {
$('#fruit-list').load("/fruit/detail?id=1");
}
</script>
</head>
<body>
<button onclick="ceshi1()">测试1</button>
<button onclick="ceshi2()">测试2</button>
<div id="fruit-list" style="text-align: center;margin:0 auto; 900px" th:fragment="fruit-list">
<table width="100%" border="1" cellspacing="1" cellpadding="0">
<thead>
<th>ID</th>
<th>水果名</th>
</thead>
<tbody>
<tr th:each="fruit : ${fruits}">
<td th:text="${fruit.id}"></td>
<td th:text="${fruit.name}"></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
效果：
