Controller：
@Controller @RequestMapping("/") public class IndexController { @RequestMapping("/frag") public String toFrag(Model model) { return "fragTest"; } }
templates/fragTest.html：
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.w3.org/1999/xhtml"> <!-- <head th:include="/frag/oneHeader :: head(~{::title},~{::link},~{::script})"> <title>fragTest oneHeader</title> <link rel="stylesheet" th:href="@{/lib/bootstrap-3.3.7-dist/css/bootstrap.min.css}"> <script th:src="@{/lib/jquery-3.3.1.min.js}"></script> </head> --> <head th:include="/frag/twoHeader :: head(~{::title})"> <title>fragTest twoHeader</title> </head> <body> <!-- <div th:replace="/frag/header :: frag ('one', 'two')">...</div> <div th:replace="/frag/header :: frag (onevar='good',twovar='morning')">...</div> 可以不按照参数定义的顺序 <div th:replace="/frag/header :: frag (twovar='man',onevar='woman')">...</div> --> <div class="container"> <div class="row"> <div class="col-md-4 col-md-offset-4"> <div class="panel panel-default"> <div class="" style="margin-top: 30px"> <h3 class="panel-title " style="color:red" th:text="${msg}">添加失败</h3> </div> <div class="panel-heading" style="margin-top: 30px"> <h3 class="panel-title">Login</h3> </div> <div class="panel-body"> <form th:action="@{'/user/saveOne'}" method="post" th:object="${user}"> <div class="form-group form-inline"> <label for="txtName" class="col-md-3 control-label" style="text-align: right;">用户名</label> <div class="col-md-9"> <input name="name" type="text" class="col-md-9 form-control" id="txtName" placeholder="请输入用户名" th:field="*{name}" required="required" /> </div> </div> <div class="form-group form-inline" style="padding-top:45px"> <label for="txtPwd" class="col-sm-3 control-label" style="text-align: right;">密码</label> <div class="col-md-9"> <input name="pwd" type="password" class="col-sm-9 form-control" id="txtPwd" placeholder="请输入密码" th:field="*{pwd}" /> </div> </div> <div class="form-group form-inline" style="padding-top:45px"> <label for="txtAge" class="col-sm-3 control-label" style="text-align: right;">年龄</label> <div class="col-md-9"> <input name="age" type="text" class="col-sm-9 form-control" id="txtAge" placeholder="请输入年龄" th:field="*{age}" /> </div> </div> <div class="form-group form-inline" style="padding-top:45px"> <label for="txtSex" class="col-sm-3 control-label" style="text-align: right;">性别</label> <div class="col-md-9"> <input name="sex" type="text" class="col-sm-9 form-control" id="txtSex" placeholder="请输入性别" th:field="*{sex}" /> </div> </div> <div class="form-group" style="padding-top:45px"> <div class="col-md-offset-3 col-md-5"> <button class="btn btn-primary btn-block" type="submit">添加</button> </div> </div> <div class="alert alert-danger media" th:if="${errorMsg != null}" style="padding-top:45px"> <strong th:text="${errorMsg}"> </strong> </div> </form> </div> </div> </div> </div> </div> <!-- common 的 定义好的 fotter模板引用 无参 --> <!--<div class="container" th:replace="common :: footer"></div>--> <script type="text/javascript"> $(function() { }); </script> </body> </head> </html>
templates/frag/oneHeader.html：
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.w3.org/1999/xhtml"> <head th:fragment="head(title,links,scripts)"> <title th:replace="${title}">frag header</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <th:block th:replace="${links}" /> <th:block th:replace="${scripts}" /> </head> <body> <div th:fragment="frag (onevar,twovar)"> <p th:text="${onevar} + ' - ' + ${twovar}">...</p> </div> </body> </html>
templates/frag/twoHeader.html：
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.w3.org/1999/xhtml"> <head th:fragment="head(title)"> <title th:replace="${title}">frag header</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" th:href="@{/lib/bootstrap-3.3.7-dist/css/bootstrap.min.css}"> <script th:src="@{/lib/jquery-3.3.1.min.js}"></script> </head> <body> <div th:fragment="frag (onevar,twovar)"> <p th:text="${onevar} + ' - ' + ${twovar}">...</p> </div> </body> </html>