Thymeleaf传递给js方法值

王会举

已于 2023-05-30 14:13:02 修改

阅读量2.9w

点赞数 21

CC 4.0 BY-SA版权

分类专栏：前端文章标签： Thymeleaf js

于 2018-07-01 22:01:11 首次发布

本文链接：https://blog.youkuaiyun.com/wang5701071/article/details/80877890

前端专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何使用Thymeleaf向JavaScript方法传递值，包括传递单一ID值及结合this关键字的方法，并提供示例代码。同时分享了Thymeleaf常用的条件表达式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Thymeleaf传递给js方法值

Thymeleaf 身为SpringBoot的正宫; 推荐模板竟然不被广大开发者热衷. 这就导致了一些听从Spring建议的程序猿遇到Thymeleaf问题无处可问. 我不幸的也中枪了!!! 可以看官方文档的大佬请无视我这个萌新.

话入正题, 今天在写项目时发现Thymeleaf给onclick传递值时如此的困难,试了很多次终于成功了! 代码附上

<a  th:onclick="'javascript:del('+${user.id}+');'" ></a>
 <script>
   function  del(id) {
      alert(id);
                      }
 </script>

解释下: (1) th:onclick 对应的就是 js中的onclick

(2) javascript: del() 前面的javascript: 是不变的 del是你的方法名

(3) ${user.id} 对应的就是你要获取的对象的值

(4) 上面代码的符号不要少打哦 ,不然网页就崩溃了

这种是只传递id值. 但是很多场景还要根据ajax的返回值进行判断删除. 这个时候把方法中的参数加上this就好了. 这个是时候的代码就变成了这样.

<a  th:onclick="'javascript:del('+this+','+${user.id}+');'" ></a>
<script>
   function  del(obj,id) {
      alert(id);
                      }
</script>

这个时候this也就传进来了. 一起学Thymeleaf的小伙伴们快去试试吧

Thymeleaf常用的判断表达式


gt：great than（大于）>
ge：great equal（大于等于）>=
eq：equal（等于）==
lt：less than（小于）<
le：less equal（小于等于）<=
ne：not equal（不等于）!=

用法：例 th:if="${xx} lt 'n'" 解释: (当${xx} 小于 'n' 的时候执行if 的内容)

<div th:if=" ${xx} lt '3'">
  <div class="addList">
    <p>
       <a id="href">
            <span class="icon"></span>添加绑定
        </a>
    </p>
   <p> xx绑定只能小于3</p>
    </div>
</div>

1.thymealf时间格式化

model传值

th:value="${#dates.format(machine.endDate,'yyyy-MM-dd HH:mm:ss')}">