解决Thymeleaf中onclick的坑

 更新时间:2025年08月06日 14:13:50   作者:离颜i  
Thymeleaf中onclick属性无法直接传递字符串参数,需改用data-*属性存储,再通过JS读取,避免模板解析错误,但可能仍有警告

Thymeleaf中onclick的坑

最近学了springboot,springboot推荐使用thymeleaf模板,所以一直在用,然后发现许许多多的坑,这次就说说其中关于onclick的坑。

在一个button元素中,需要调用js的方法,并且传递两个来自model的参数,一开始我是这么写的

<button 
    th:onclick=" 'cookOver(' + ${item.getOid()} + ',' + ${item.getFid()} + ')' " >出餐
</button>

接下来加载html就报错了

报错信息如下:

org.thymeleaf.exceptions.TemplateProcessingException: Only variable expressions returning numbers or booleans are allowed in this context, any other datatypes are not trusted in the context of this expression, including Strings or any other object that could be rendered as a text literal. A typical case is HTML attributes for event handlers (e.g. "onload"), in which textual data from variables should better be output to "data-*" attributes and then read from the event handler. (template: "/manage/cookWindow" - line 32, col 13)

神奇的是:同一个项目中的另一个HTML中,也是这样的写法,没有报错,成功运行,参数传递也都没有问题。

百思不得其解

于是到网上查了下,发现还有一种另写法,我就试了试

<button 
    th:onclick="cookOver([[${item.getOid()}]],[[${item.getFid()}]])">出餐
</button>

结果出现这样的问题:

这个问题很神奇,不影响正常运行,但这个红色波浪线让我非常难受

总结

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

相关文章

  • Java中dubbo+zookeeper微服务架构简介

    Java中dubbo+zookeeper微服务架构简介

    Apache Dubbo是一款高性能的 Java RPC 框架,这篇文章主要介绍了Java中dubbo+zookeeper微服务架构,需要的朋友可以参考下
    2021-09-09
  • JDK21中虚拟线程到底是什么以及用法总结(看完便知)

    JDK21中虚拟线程到底是什么以及用法总结(看完便知)

    这篇文章主要给大家介绍了关于JDK21中虚拟线程到底是什么以及用法的相关资料,虚拟线程是一种轻量化的线程封装,由jvm直接调度和管理,反之普通的线程其实是调用的操作系统的能力,对应的是操作系统级的线程,需要的朋友可以参考下
    2023-12-12
  • String.join()方法示例详解

    String.join()方法示例详解

    String.join() 方法是连接指定数组的元素或集合的成员,在每个元素或成员之间使用指定的分隔符,这篇文章主要介绍了String.join()方法示例详解,需要的朋友可以参考下
    2024-01-01
  • Java异常处理及自定义异常详细指南

    Java异常处理及自定义异常详细指南

    异常处理是Java编程中的一个重要部分,用于处理程序执行中出现的异常情况,此外还可以自定义异常来处理特定的错误情况,掌握这些异常处理技术对于编写健壮、可靠的Java程序至关重要,需要的朋友可以参考下
    2024-10-10
  • Java生产者消费者的三种实现方式

    Java生产者消费者的三种实现方式

    这篇文章主要介绍了Java生产者消费者的三种实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-07-07
  • Spring @Scheduler使用cron表达式时的执行问题详解

    Spring @Scheduler使用cron表达式时的执行问题详解

    Spring给程序猿们带来了许多便利。下面这篇文章主要给大家介绍了关于Spring @Scheduler使用cron表达式时的执行问题的相关资料,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧
    2018-09-09
  • Java实现http请求文件流对带宽限速获取md5值

    Java实现http请求文件流对带宽限速获取md5值

    文章介绍了如何在进行HTTP请求下载大数据时处理带宽限制和并发问题,通过使用缓冲区和限速逻辑,可以有效控制下载速度,避免掉包和数据丢失,核心公式基于带宽和已下载字节数计算预期耗时,并通过Thread.sleep()进行动态休眠补偿,感兴趣的朋友一起看看吧
    2025-02-02
  • Spring AOP手动实现简单动态代理的代码

    Spring AOP手动实现简单动态代理的代码

    今天小编就为大家分享一篇关于Spring AOP手动实现简单动态代理的代码,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-03-03
  • SpringBoot整合Mybatis与thymleft实现增删改查功能详解

    SpringBoot整合Mybatis与thymleft实现增删改查功能详解

    MybatisPlus是国产的第三方插件, 它封装了许多常用的CURDapi,免去了我们写mapper.xml的重复劳动。本文将整合MybatisPlus实现增删改查功能,感兴趣的可以了解一下
    2022-12-12
  • Java如何基于wsimport调用wcf接口

    Java如何基于wsimport调用wcf接口

    这篇文章主要介绍了Java如何基于wsimport调用wcf接口,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-06-06

最新评论