thymleaf th:id value in javascript

Question

需要检查Javascript中文本字段值的格式。

我正在使用thymelaf来渲染页面。

为了实现这一点，我计划使用th:id并在Javascript中使用this(类似于document.getElementById并读取值。但我不知道如何在迭代时获得Javascript中文本字段的值。.

以下是的场景

在迭代通过Map<字符串，字段>(其中Field是一个包含两个元素fieldValueList(List(和timeField(boolean(的类。检查页面中输入的textField的格式(textField的格式应为hh:mm:ss(需要用javascript完成。我使用id读取值，但不知道如何获取javascript中文本字段的值。

页面的代码是

<fieldSet th:each="fieldKey,fieldKeyIndex : *{recipeFieldMap.keySet()}">
<div class="fieldDiv" th:each="fieldVal,field : *{recipeFieldMap[__${fieldKey}__].fieldValueList}">
<span class="fieldSpan" th:if="*{recipeFieldMap[__${fieldKey}__].timeField}">
<input type="text" th:id="|text_${fieldKeyIndex.index}_${field.index}|" th:field="*{recipeFieldMap[__${fieldKey}__].fieldTimeValueList[__${field.index}__].displayStr}" onchange="checkTimeStr()">
<script th:inline="javascript">
/*<![CDATA[*/
function checkTimeStr() {
// Something like this.. to read the value
//var value = document.getElementById('/* text_${groupKeyIndex.index}_${field.index} */').value;
//alert(value)
}
/*]]>*/
</script>
</span>
<span class="fieldSpan" th:unless="*{recipeFieldMap[__${fieldKey}__].timeField}">
<input type="text" th:field="*{recipeFieldMap[__${fieldKey}__].fieldValueList[__${field.index}__]}">
</span>
</div>
</fieldSet>

在此处输入图像描述

Answer 1

试试这个：

<script th:inline="javascript">
[[${field.index}]]
</script>