如何在 HTML 中使用变量

Question

我正在尝试在我的 HTML 文件中使用一个名为“描述”的变量，我的定义如下：

       <h1 th:text="'Product ' + ${item.itemCode}"></h1>
            <div class="inset">
                <p>
                    <label>Item Code</label>
                    <b th:text= "${item.itemCode}"></b>
                <p>
                <p>
                    <label>Item Description</label>
                    <b th:text= "${item.Description}" contenteditable="true" name="Description" id="Description"></b>
                <p>
                <p>
                    <label>Item Price</label>
                    <b th:text= "${item.Price}" contenteditable="true" name="price" id="price"></b>
                <p>
                <p>
                    <label>Item Creation Date</label>
                    <b th:text= "${item.creationDate}" contenteditable="true" name="date" id="date"></b>
                <p>
                <p>
                    <label>Item Creator</label>
                    <b th:text= "${item.creatorUser}" contenteditable="true" name="creator" id="creator"></b>
                <p>
                <p>
                    <label>Item State</label>
                    <b th:text= "${item.itemEnum.getEstado()}"></b>
                <p>

                <p>
                    <a th:href="@{/api/item/saveChanges(itemCode = ${item.itemCode}, description = getVariable())}"> <input name="submit" type="submit" value="Save Changes" /></a>
                </p>
                <p th:if="${item.itemEnum.getEstado() == 'Active'}">
                    <a th:href="@{/api/item/changeInactive/{itemCode}(itemCode = ${item.itemCode})}"> <input name="submit" type="submit" value="Deactivate" width="100%"/></a>
                </p>
                <p th:if="${item.itemEnum.getEstado() == 'No Active'}">
                    <a th:href="@{/api/item/changeActive/{itemCode}(itemCode = ${item.itemCode})}"> <input name="submit" type="submit" value="Activate" width="100%" /></a>
                </p>

            </div>
<script>
    function getVariable(){
        return document.getElementById("Description");
    }
</script>

基本上，我从控制器中获取该变量。但是，它是可编辑的。我想要的是能够获取“描述”的当前值，以便我可以将其发送回控制器进行更新，如下所示：

<a th:href="@{/api/item/saveChanges(description = ${Description})

Answer 1

你可以像这样使用它：

<textarea rows="7" cols="10" th:text= "${item.Description}" name="Description" >

在控制器中接收它，如果用户更新它，你会得到一个更新的值。