Thymeleaf 教程（六）设置属性值
⽬录
设置属性值
原始表单我们可以通过th:attr 来设置input 或者form 或者其他标签的属性。如：他会替换相同属性的值。结果如下：当然，有的时候我们需要⼀次设置多个属性。怎么办?通过“，”隔开：结果是：通过特殊属性设置
上⾯的设置值⽅式很通⽤，但是很丑陋。我们提供th ：*这样的⽅式来替代th:attr 。th:attr 在项⽬中⼀般不建议使⽤。⽐如th:value 是不是⽐th:attr 要简单些，同事避免你打错属性。同样的。
<form  action ="subscribe.html">    <fieldset >        <input  type ="text" name ="email" />        <input  type ="submit" value ="Subscribe me!" />    </fieldset ></form >
1
2
3
4
5
6<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 >
1
2
3
4
5
6<form  action ="/gtvg/subscribe">    <fieldset >        <input  type ="text" name ="email" />        <input  type ="submit" value ="¡Suscríbeme!"/>    </fieldset ></form >
1
2
3
4
5
6<img src="../../images/gtvglogo.png"th:attr="src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />
1
2<img  src ="/gtgv/images/gtvglogo.png" title ="Logo de Good Thymes" alt ="Logo de Good Thymes" />1<input type ="submit" value ="Subscribe me!" th:attr="value=#{subscribe.submit}"/>1<input type ="submit" value ="Subscribe me!" th:value ="#{subscribe.submit}"/>1
Thymeleaf属性列表
有很多这样的属性，它们每个都针对特定的XHTML或HTML5属性: th:abbr
th:accept
th:accept-charset
th:accesskey
th:action
th:align
th:alt
th:archive
th:audio
th:autocomplete
th:axis
th:background
th:bgcolor
th:border
th:cellpadding
th:cellspacing
th:challenge
th:charset
th:cite
th:class
th:classid
th:codebase
th:codetype
th:cols
th:colspan
th:compact
th:content
th:contenteditable
th:contextmenu
th:data
th:datetime
th:dir
th:draggable
th:dropzone
th:enctype
th:for
th:form
th:formaction
th:formenctype
th:formmethod
th:formtarget
th:frame
th:frameborder
th:headers
th:height
th:high
th:href
th:id
th:keytype th:kind
th:label
th:lang
th:list
th:longdesc th:low
th:manifest th:marginheight th:marginwidth th:max
th:maxlength th:media
th:method th:min
th:name
th:optimum th:pattern
th:placeholder th:poster
th:preload th:radiogroup th:rel
th:rev
th:rows
th:rowspan th:rules
th:sandbox th:scheme th:scope
th:scrolling th:size
th:sizes
th:span
th:spellcheck th:src
th:srclang
th:standby th:start
th:step
th:style
th:summary th:tabindex th:target
th:title
th:type
th:usemap th:value
th:valuetype th:vspace
同时设置多个属性值或者这样追加后⾯和追加前⾯的属性
th:attrappend 后⾯追加
th:attr
前⾯追加
例如：cssStyle=warning ，追加后⾯即为这⾥还有两种类似的特殊属性th:classappend 和th:styleappend 固定值，boolean 属性
有⼀些特殊属性的值是固定的。⽐如checked ：⽤法：固定值，boolean 类型属性列表如下：th:async
th:autofocus
th:autoplay
th:checked
<img src="../../images/gtvglogo.png"th:src="@{/images/gtvglogo.png}" th:title="#{logo}" th:alt="#{logo}" />
1
2<img src="../../images/gtvglogo.png"th:src="@{/images/gtvglogo.png}" th:alt-title="#{logo}" />
1
2<input type ="button" value ="Do it!" class ="btn" th:attrappend="class=${' ' + cssStyle}" />
1
<input type ="button" value ="Do it!" class ="btn warning" />1<tr  th:each ="prod : ${prods}" class="row" th:classappend="${prodStat.odd}? 'odd'">
1<input type ="checkbox" name="option1" checked="checked" /><input type ="checkbox" name="option2" />
1
2
<input type ="checkbox" name="active" th:checked="${user.active}" />1
th:default
th:defer
th:disabled
th:formnovalidate
th:hidden
th:ismap
th:loop
th:multiple
th:novalidate
thymeleaf用法th:nowrap
th:open
th:pubdate
th:readonly
th:required
th:reversed
th:scoped
th:seamless
th:selected
html5的data 语法⽀持
属性可以在HTML5中⽤这种⽅式写：data-{prefix}-{name}<table><tr data-th-each="user : ${users}"><td data-th-text="${user.login}">...</td><td data-th-text="${user.name}">...</td></tr></table>1
2
3
4
5
6

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。