问题描述
我正在开发基本上允许用户输入产品数据然后将其添加到表格中的网页的网络应用程序。我想将此信息保存在某种文件中（目前只在我的计算机上本地），以便用户可以打开他或她之前创建的条目。
I'm working on web app that basically allows the user to enter data about a product and then add it to the web page in a table. I would like to save this information in a file of some kind (just locally on my computer, for now) so that the user can open his or her previously-created entries.
这是html页面的精简版本：
This is a stripped-down version of the html page:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<div>
<table id="itemsTable">
<tr>
<th>Date Added</th>
<th>Item Description</th>
</tr>
</table>
</div>
<div id="itemInput">
<h3>Add Item</h3>
Date Added:<input type="date" id="dateAdded">
Description:<input type="text" id="description">
<input type="button" value="Add Row" onclick="addRowFunction();">
<input type="button" value="Delete Selected" onclick="deleteRowFunction();">
</div>
</html>
然后我有一些javascript来评估和解释数据，客户端。我正在寻找存储记录条目（本地）的想法。不仅如此，我还在寻找有关如何删除已存储信息的建议。
I then have some javascript to evaluate and interpret the data, client-side. I'm looking for ideas to store the recorded entries (locally). Not only that, but I'm looking for suggestions as to how to delete information that's been stored as well.
编辑：
根据您的要求，这里是我的JS代码的片段：
As per your request, here is a snippet of my JS code:
//Striped-down object
function Item (dateListed, description) {
this.dateListed = dateListed;
this.description = description;
}
//Simple function to take data from form, create object, add to table.
function addItem() {
var dateAdded = document.getElementById('dateAdded').value;
var description = document.getElementById('description').value;
// I realize that using an object in this striped-down version is kind of
// unnecessary, but in the full code it makes more sense.
var newItem = new Item(dateAdded, description);
table = document.getElementById('itemsTable');
var row = table.insertRow(1);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = newItem.dateListed;
cell2.innerHTML = newItem.description;
}
推荐答案
我建议或。
如果涉及非常有限的数据操作， localStorage 将非常有用。 （ CRUD 操作可以在此轻松完成），但如果涉及更复杂的操作，请使用 indexedDb 。
The localStorage will be useful if you have very limited data manipulation involved. (CRUD operations can be done in this easily), but if you have more complicated manipulation involved, use indexedDb.
这篇关于在网页上本地存储用户输入数据的最佳方法是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！