Question

我有以下运动问题，我很难绕过头脑：

到目前为止，我已经启动了代码：

<!DOCTYPE html>
<html>
<head>
<title></title>
	<script>
		function addItem(){
			var form = document.getElementById("form1");
			var item = form.elements["name"].value;
			var cost = form.elements["price"].value;
			
			//what should I do next?
		}
		
		function removeItem(){
			//remove item code here
		}
	</script>
</head>
<body>
	<form id="form1">
		Item Name: <input name="name" type="text">
		Item Cost: <input name="price" type="text">
		<button onclick="addItem()">Add</button>
		<button onclick="removeItem()">Remove</button>
	</form>
	<div id="div1">
		<ul id="ul1">
		</ul>
	</div>
</body>
</html>

我有我希望页面看起来的基本结构。我知道我必须创建两个函数来处理添加项目并删除问题中的项目条件。但是，在我必须保存用户输入的那一点上，我有点迷失。我知道我必须使用网络存储，可能还有数组？该如何编码？

非常感谢任何见解。提前谢谢。

Answer 1

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

// Put the object into storage
localStorage.setItem('testObject', JSON.stringify(testObject));

// Retrieve the object from storage
var retrievedObject = localStorage.getItem('testObject');

console.log('retrievedObject: ', JSON.parse(retrievedObject));

来源：Storing Objects in HTML5 localStorage

Javascript：使用Web存储创建购物清单

1 个答案: