我正在创建我的第一个 html5 Web 应用程序，它记录用户的体重进度。目前我有一个简单的表单，可以在下面打印输入。我希望将其保存在本地存储中，并且我还希望能够添加更多输入并将其显示在表格中。有人可以帮我解决这个问题吗？我是个新手。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Home Fitness</title>
<link type="text/css" rel="stylesheet" href="styles.css" />
<script>
function display(form){
form.o_weight.value = form.weight.value;
return false;
}
</script>
</head>
<body>
<header>
<h1>Weight Tracker</h1>
</header>
<article>
<h2>Weight Input</h2>
<p>Please enter your current weight below and submit.</p>
</article>
<form name="input" action="" method="get" onsubmit="return display(this);">
<section>
<p>Weight:</p><input type="text" name="weight">
<input type="submit" value="Submit">
</section>
<section>
<table>
<th>Weight</th>
<tr>
<td><output name="o_weight" style="width:100px; height:20px"></output></td>
</tr>
</table>
</section>
</form>
<nav>
<ul>
<li><a href="index.html">home</a></li>
</ul>
</nav>
<footer>
</footer>
最佳答案
你可以这样做:
function display(form){
//get all form elements
var elements = form.elements;
//loop through the elements
for(var i = 0; i< elements.length; i++){
//store every item individually
localStorage.setItem(elements[i].name, elements[i].value);
}
}
通过以下方式检索值:
var weigth = localStorage.getItem('weight');//input with name "weigth"
关于javascript - 如何使用 html5 本地存储显示用户输入列表？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20801012/