SpringBoot+Thymeleaf页面中使用th:onclick的几种方法

我以以下代码为演示代码

<script th:inline="javascript">
function getName(name){
    console.log(name);
}
<script>

方法一：

<button class="btn" th:onclick="getName([[${person.name}]]);">获得名字</button>

通过[[${person.name}]]获得实际的值，其中person是model。

方法二：

<button class="btn" th:onclick="'javascript:getName(\''+${person.name}+'\');'">获得名字</button>

通过'javascript:getName(\''+${person.name}+'\');'获取值，一定要在方法名前加"JavaScript:"。在我看的书《SpringBoot 实战》，作者汪云飞书中。他使用的是'getName(\''+${person.name}+'\');'，运行网页报500错误，不知道是版本问题还是其他问题。所以一定要加"JavaScript:"。

方法三：

<button class="btn" th:onclick="|getName(${person.name})|">获得名字</button>

这几种方法大家看着方便使用，我推荐方法一。具体还得看具体问题该使用哪种方法。