java-thymeleaf的使用方式

 更新时间:2024年08月10日 09:16:51   作者:自由的风~~  
这篇文章主要介绍了java-thymeleaf的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

java-thymeleaf的使用

首先thymeleaf的引入

<html lang="en" xmlns:th="http://www.thymeleaf.org">

引入依赖 <!--使用thymeleaf-->

<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

常用语法

1、页面插入,比如翻页功能就经常单独作为一个页面然后插入到主页面中page.html中最外面加个div标签包住(使用fragment标记)

<div th:fragment="flag">
	<table width="95%" align="center"  cellpadding="0" cellspacing="0">
</div>  
主页面中插入
<div th:insert="/common/page :: flag"></div>  意思是插入page页面中的被包住的flag那一段

2、 为了防止user以及name为null页面报错,写成如下格式 所有的.前面加个?就行了,如${list?.user?.name}

3、select选项标签

<select name="film_type_id" id="film_type_id" style="width:155px">
	<option value="0">请选择</option> 
	<option th:selected="${option.film_type_id} == ${film?.film_type_id}" th:each="option : ${filmTypes}" th:value="${option.film_type_id}" th:text="${option.film_type_name}"></option>
</select>
  • th:selected用于编辑页面数据回显
  • th:each是遍历filmTypes,option是遍历出的单值
  • th:value是提交上去的数据
  • th:text是显示在页面上的数据

4、复选框功能实现

<span th:each="subString : ${'09:00、11:00、13:00、15:00、17:00、19:00、 21:00、23:00'.split('、')}">
	<input type="hidden" id="film_scene" name="film_scene" th:value="${film?.film_scene}" /> 
	<input th:value="${subString}" type="checkbox" name="film_scenes" th:checked=="${#strings.contains(film.film_scene==null?'1':film.film_scene, subString)}"/><label>[[${subString}]]</label>  
</span>

这个是图片中 复选框功能的实现,th:each遍历的数据是自己分割的,th:checked也是用于编辑页面数据回显,""中的判断结果为true则选中,KaTeX parse error: Expected '}', got '#' at position 2: {#̲strings.contain…{}]]常用于标签之间比如[[subString]]</label>,[[{}]]判空如下

<span>[[${film!=null && film.film_id!=0?'编辑':'添加'}]]电影</span>

5、if判断

<div th:if="${film!=null && film.film_id!=0}">
	 <input type="button" id="editBtn" Class="btnstyle" value="编 辑"/> 
</div>

这个是替换Jsp中的if标签

6、实现根据传递过来的film参数是否为null动态调整标签为 添加/编辑 页面标题功能

  • 两种,其一:直接在th:text里面判断
<TD class="edittitle" th:text="${film!=null && film.film_id!=0?'编辑':'添加'}+'电影'"></TD>
  • 其二:使用th:if和th:unless,这两个是个组合
<TD class="edittitle" th:if="${film!=null && film.film_id!=0}" th:text="编辑电影"></TD>
<TD class="edittitle" th:unless="${film!=null && film.film_id!=0}" th:text="添加电影"></TD>

7、标签

<td align="left" colspan="3">
	<img id="userImg" th:src="${('/upload/'+film.film_pic)}" width="70" height="80" style="border:0px;"/>
&nbsp;<span id="op" style="display:none"><img src="images/image/loading004.gif"  height="80" /></span>
</td>

th:src加载图片,这里的/upload是虚拟路径,映射到F盘的某个图片文件,film是接收的参数

下面还有一个img加载的是本地的图片就没有必要用thymeleaf,要接收参数时用

8、iframe语法

将整个Html页面引入到另一个html中去

<iframe name="uploadPage" th:replace="sys/uploadImg :: html" width="100%" height="50" marginheight="0" marginwidth="0" scrolling="no" frameborder="0"></iframe>

意思是将uploadImg.html整个html引入,不需要在uploadImg.html中标记fragment

但是这样引入是有些不好的地方(具体可见下一篇),当然一般情况下没问题,建议用以下方法:

springboot项目中假设静态资源指向static文件夹,直接将要引入的页面放在static文件夹下,然后代码如下

<iframe name="uploadPage" src="/uploadImg.html" width="100%" height="50" marginheight="0" marginwidth="0" scrolling="no" frameborder="0"></iframe>

意思是在resources根目录下开始找uploadImg.html

9、${#lists.size()}内置对象函数,判断传过来的list参数

<div th:if="${#lists.size(films)>0 && films!=null}"></div>

10、遍历中的count计数器

<tr class="list0" onmouseover="tr_mouseover(this)" onmouseout="tr_mouseout(this)" th:each="m,count:${films}"> 
     <td width="" align="center"><input type="checkbox" name="chkid" th:value="${m.film_id}" style="vertical-align:text-bottom;"/></td>
     <td width="" align="center">[[${count.index+1}]]</td>
     <td width="" align="center">[[${m.film_name}]]</td>
     <td width="" align="center">[[${m.film_type_name}]]</td>
     <td width="" align="center">[[${m.film_actors}]]</td>
     <td width="" align="center">¥[[${m.film_price}]]</td>
     <td width="" align="center">[[${m.film_date}]]</td>
     <td width="" align="center">[[${m.film_scene}]]</td>
     <td width="" align="center">[[${m.film_room}]]</td>
     <td width="" align="center">[[${m.film_score}]]</td>
     <td width="" align="center">

th:each=“m,count:${films}” 其中,m为遍历单值,count计数

11、a标签格式

<a th:href="@{/book/page(book=${bookId}, page=${pageNumber})}" rel="external nofollow"  //其中book和page为携带的参数

12、点击事件

th:onclick="'javascript:openBox(\''+${curCabNo}+'\',\''+${box.no}+'\')'"

13、script格式

<script th:inline="javascript" type = "text/javascript">
	var flag = [[${tip}]]; 
</script>

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • SpringBoot三种方法接口返回日期格式化小结

    SpringBoot三种方法接口返回日期格式化小结

    本文介绍了三种在Spring Boot中格式化接口返回日期的方法,包含使用@JsonFormat注解、全局配置JsonConfig、以及在yml文件中配置时区,具有一定的参考价值,感兴趣的可以了解一下
    2025-01-01
  • Java线程局部变量ThreadLocal的核心原理与正确实践指南

    Java线程局部变量ThreadLocal的核心原理与正确实践指南

    ThreadLocal是一个强大而精巧的工具,它通过线程隔离数据的方式,优雅地解决了特定场景下的线程安全问题,本文给大家介绍Java线程局部变量ThreadLocal的核心原理与正确实践指南,感兴趣的朋友跟随小编一起看看吧
    2025-11-11
  • SpringBoot整合LocalDateTime的过程

    SpringBoot整合LocalDateTime的过程

    LocalDateTime 和 Date 是 Java 中处理日期和时间的两种不同的类,在 JDK8 中引入了 java.time 包,这篇文章主要介绍了SpringBoot整合LocalDateTime的过程,需要的朋友可以参考下
    2024-08-08
  • java判断字符串相等的方法

    java判断字符串相等的方法

    今天小编就为大家分享一篇java判断字符串相等的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-07-07
  • springMVC 用户登录权限验证实现过程解析

    springMVC 用户登录权限验证实现过程解析

    这篇文章主要介绍了springMVC 用户登录权限验证实现过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-11-11
  • Java中利用BitMap位图实现海量级数据去重

    Java中利用BitMap位图实现海量级数据去重

    有许多方法可以用来去重,比如使用列表、集合等等,但这些方法通常只适用于一般情况,然而,当涉及到大量数据去重时,常见的 Java Set、List,甚至是 Java 8 的新特性 Stream 流等方式就显得不太合适了,本文给大家介绍了Java中利用BitMap位图实现海量级数据去重
    2024-04-04
  • SpringBoot+MyBatisPlus+Vue 前后端分离项目快速搭建过程(前端篇)

    SpringBoot+MyBatisPlus+Vue 前后端分离项目快速搭建过程(前端篇)

    这篇文章主要介绍了SpringBoot+MyBatisPlus+Vue 前后端分离项目快速搭建过程(前端篇),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-05-05
  • 详解如何有效地处理Java中的多线程

    详解如何有效地处理Java中的多线程

    在现代软件开发中,多线程编程已成为提高程序性能和响应速度的重要手段,Java提供了丰富的多线程支持,使得在Java中实现并发操作变得相对简单,本文将深入探讨Java多线程编程的基本概念、常见问题和最佳实践,需要的朋友可以参考下
    2024-06-06
  • 使用Java注解模拟spring ioc容器过程解析

    使用Java注解模拟spring ioc容器过程解析

    这篇文章主要介绍了使用Java注解模拟spring ioc容器过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-07-07
  • Spring WebFlux 与 WebClient 使用指南及最佳实践

    Spring WebFlux 与 WebClient 使用指南及最佳实践

    WebClient是Spring WebFlux模块提供的非阻塞、响应式HTTP客户端,基于Project Reactor实现,适用于高并发场景spring webclient,本文给大家介绍Spring WebFlux与WebClient使用指南及最佳实践,感兴趣的朋友一起看看吧
    2025-07-07

最新评论