using thymeleaf之七设置属性的值（th:attr/th:value/th:alt-title/th:attrappend/th:attrprepend/th:checked）

最新推荐文章于 2022-07-10 18:14:39 发布

转载最新推荐文章于 2022-07-10 18:14:39 发布 · 3.4k 阅读

thymeleaf 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了Thymeleaf模板引擎中属性表达式的使用方法，包括如何设置属性值、同时设置多个属性值、设置相同alt和title属性值等技巧，并提供了具体的代码示例。

原文来自:https://blog.youkuaiyun.com/sun_jy2011/article/details/40215423

7.1 th:attr

用于设置其他属性的值，但不是所有属性的值都能设置，如text。

[html]view plain copy
<form action="subscribe.html" th:attr="action=@{/subscribe}">  
  <fieldset>  
    <input type="text" name="email" />  
    <input type="submit" value="Subscribe me!" th:attr="value=#{subscribe.submit}"/>  
  </fieldset>  
</form>  

th:attr还可以同时设置多个属性的值，以逗号隔开

[html]view plain copy
<img src="../../images/gtvglogo.png"   
     th:attr="src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />  

7.2 th:alt-title

用于设置 alt 和title属性的值相同的两个属性。

[html]view plain copy
<img src="../../images/gtvglogo.png"   
     th:src="@{/images/gtvglogo.png}" th:title="#{logo}" th:alt="#{logo}" />  

用th:alt-title后：

[html]view plain copy
<img src="../../images/gtvglogo.png"   
     th:src="@{/images/gtvglogo.png}" th:alt-title="#{logo}" />  

7.3 th:attrappend和th:attrprepend

th:attrappend属性值前缀，例如一个标签的类名为a，想要变为“a b”，即增加一个类样式，可以使用此属性.

[html]view plain copy
<input type="button" value="Do it!" class="btn" th:attrappend="class=${' ' + cssStyle}" />  

th:attrprepend的用法则相反，

[html]view plain copy
th:attrappend="class=${cssStyle+' '}"  

7.4 th:checked设置复选框的值

此为布尔值属性之一，以后会详细介绍其他属性，在此先介绍th:checked。

（1）选中为：

[html]view plain copy
<input type="checkbox" name="active" th:checked="true" />  

（2）未选中为：

[html]view plain copy
<input type="checkbox" name="noactive" th:checked="false" />  

thymeleaf解析时不会设置th:checked属性，即解析后为

[html]view plain copy
<input type="checkbox" name="noactive" />  