我正在使用Java,Thymeleaf,Spring,HTML和一些CSS在Eclipse中使用購物清單Web應用程序。我使用HTML將複選框列表編碼到應用程序中,因此當我完成特定列表時,我可以單擊複選框並在文本中放置一行。但是,當我刷新頁面時,複選框不會保持檢查狀態。我希望能夠通過刷新頁面來保持該框。我已經嘗試了其他堆棧溢出問題的各種不同代碼,比如將JavaScript編碼到HTML頁面中,但似乎沒有任何工作到目前爲止。這裏是我的HTML代碼:如何在頁面刷新時保留複選框選擇?
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org"
\t xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
\t layout:decorator="layouts/basic">
<link rel="stylesheet" th:href="@{/templates.css/main.css}" />
<head>
<title>Getting Started: Serving Web Content</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
table, th, td {
\t border: 1px solid black;
\t border-collapse: collapse;
\t padding: 15px;
}
.strikethrough:checked+.strikeThis {
\t text-decoration: line-through
}
</style>
</head>
<body layout:fragment="content">
\t <div class="row">
\t \t <h1>Shopping Lists</h1>
\t \t <!-- a simple button for later to add shopping lists -->
\t \t <a href="/" th:href="@{|/ListsofLists/add|}"><input type="button"
\t \t \t value="Add list" /></a>
\t \t <table>
\t \t \t <thead>
\t \t \t \t <tr>
\t \t \t \t \t <th>Name</th>
\t \t \t \t \t <th> </th>
\t \t \t \t \t <th> </th>
\t \t \t \t </tr>
\t \t \t </thead>
\t \t \t <tbody class="list">
\t \t \t \t <tr th:each="list : ${lists}">
\t \t \t \t \t <td><input type="checkbox" name="check" class="strikethrough"
\t \t \t \t \t \t value="1" /> <label for="check" class="strikeThis"
\t \t \t \t \t \t th:text="${list.name}"> Name </label></td>
\t \t \t \t \t <!-- \t <td th:text="${list.name}"></td> -->
\t \t \t \t \t <td><a href="/" th:href="@{|/ListsofLists/${list.id}|}">Show</a></td>
\t \t \t \t \t <td><form method="POST">
\t \t \t \t \t \t \t <input type="hidden" name="listId" th:value="${list.id}" />
\t \t \t \t \t \t \t <button type="submit">Delete</button>
\t \t \t \t \t \t </form></td>
\t \t \t \t </tr>
\t \t \t </tbody>
\t \t </table>
\t </div>
</body>
</html>
我會盡量回答儘可能多的問題,儘可能以弄清楚這個問題。如果這件事相當簡單,我很抱歉,我對編碼和仍然學習很陌生。
有很多方法可以做到,一個簡單的方法可以是cookies –
您可以在控制器類中使用session屬性 –