thymeleaf附加条件三元运算符嵌套判断
⽬标:为了动态给标签页根据不同的数值相应不同的颜⾊
官⽅提⽰写法
嵌套写法
th:attr="style=${n>4 ? ( n<8 ? 'background-color:#bef5d0' : 'background-color:#f5eaf1' ) : 'background-color:#f5eaf1'}"
页⾯代码
<div th:fragment="menu(n)" class="ui top attached segment">
<div class="ui container">
<div class="ui secondary menu">
<div class="ui pointing dropdown link item" th:attr="style=${n>4 ? ( n<8 ? 'background-color:#bef5d0' : 'background-col or:#f5eaf1' ) : 'background-color:#f5eaf1'}">
thyme<span class="text">课程模块</span>
<i class="dropdown icon"></i>
<div class="menu m-opacity-mini">
<a class="item"th:href="@{/course}" data-value="课程管理" th:classappend="${n==5} ? 'active'">课程管理</a><div class="ui divider"></div>
<a class="item" data-value="课程变更申请" th:classappend="${n==6} ? 'active'">课程变更申请</a><div class="ui divider"></div>
<a class="item" data-value="课程信息呈现" th:classappend="${n==7} ? 'active'">课程信息呈现</a>
</div>
</div>
</div>
</div>
</div>
效果
点击所属限定范围内的标签将会触发变⾊
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论