如何用Thymeleaf属性选择元素？

Question

我有一个包含以下元素的HTML页面：

<input type="text" th:field="*{recipientName}"/>

我想用jQuery函数按属性选择这个元素，如下所示：

$("[th:field='*{recipientName}']")

然而，我收到此错误：

Uncaught Error: Syntax error, unrecognized expression: [th:field='*{recipientName}']

如何选择此元素以及我做错了什么？

Answer 1

我相信您的问题是冒号：在属性名称中无效，因此选择器无法返回任何内容。如果您无法更改选择器的名称（即冒号是Thymeleaf要求），则必须添加备用标识符。

可能将整个字段名称和值放入数据属性中？ e.g。

<input type="text" data-somevar="th:field=*{recipientName}" th:field="*{recipientName}"/>

然后选择它：

$("[data-somevar='th:field=*{recipientName}']");

更新：我已经玩过了它，如果你在将它传递给jQuery时逃脱冒号似乎是可能的，所以这应该有效：

$("[th\\:field='*{recipientName}']");

Codepen example.

我会留下之前的答案/解释，以防其他人发现它有用。