- th:value、th:text、th:utext
- th:each
- th:href
- th:attr
- th:switch
- th:case
- th:if
- th:action
- th:fragment
th:value、th:text、th:utext 文本相关
(1)th:text
适用于div、span、textarea标签等
①对表达式或变量进行求值
<!--这里的festivalLength是后端传过来的变量-->
<h3 th:text="${festivalLength}">0</h3>条
②用“+”符号可进行文本连接
<span th:text="${name}+${code}">汉族</span>
(2)th:value
适用于input标签
<input type="text" placeholder="名称" readonly="" th:value="${name}">
(3)th:utext
会解析带有html标签的内容。(th:text不解析)
th:each 循环
<!--这里的fnation是一个对象,fnations是一个列表,name和code是对象的两个属性-->
<div th:each="fnation:${fnations}">
<span th:text="${fnation.name}+${fnation.code}">汉族</span>
</div>
th:href 链接
<!--普通的页面跳转-->
<a href="#" th:href="@{/opera}">标识管理</a>
<!--传递参数id-->
<a href="#" th:href="@{/FestivalResource/{id}(id=${fdata.id})}" target="_blank"></a>
当传递参数时,controller的写法
th:switch
<span th:switch="${home}">
<span th:case="0">节日资源列表</span>
<span th:case="1" th:text="${Searchkey}">春节</span>
</span>
th:if 判断
th:action 表单提交
<form name="search" action="#" th:action="@{/ResourceSearch}" method="post" target="_blank">
<div>
<!-- th:value="${query}"这是页面返回的 用户输入的查询条件内容 -->
<input type="text" name="query" placeholder="Search...." th:value="${query}">
<i onclick="document.forms['search'].submit()" class="search link icon"></i>
<!-- 点击i图标,提交表单 -->
</div>
</form>
th:attr 自定义属性
<!--这里的HTML代码自定义属性page-->
<a onclick="page(this)" th:attr="data-page=1">首页</a>
<a onclick="page(this)" th:attr="data-page=${apilist.currPage}-1" th:text="上一页"></a>
<a onclick="page(this)" th:attr="data-page=${apilist.currPage}+1" th:text="下一页" ></a>
<a onclick="page(this)" th:attr="data-page=${apilist.totalPage}">尾页</a>
//js代码中进行处理
function page(obj) {
//拿到页码值
$("[name='Keypage']").val($(obj).data("page"));
//alert($("[name='Keypage']").val());
loaddata();//其他处理
}
function loaddata() {
$("#list-container").load(/*[[@{/festival/festivalpage}]]*/"/festival/festivalpage",{
page : $("[name='Keypage']").val()
});
}
结合th:fragment 片段刷新阅读
th:fragment 片段刷新
这里的HTML代码是festival页面的内容–>
controller中的写法: