我为其他人创建了一个待办事项列表。但是,如果您将其关闭,则必须从头开始。我想知道如何为他们创建代码以键入提示/输入来恢复他们的列表。这是我使用的代码。
var liId = 3;
var createList = 0;
function createNewItem() {
var getText = window.prompt("What text do you want to display on this number.");
liId += 1;
var li = document.createElement("LI");
var txt = document.createTextNode(getText);
li.appendChild(txt);
li.setAttribute("id", liId);
document.getElementById("myOL").appendChild(li);
}
function crossOut() {
var cross = window.prompt("What number do you want to cross out?", "1");
document.getElementById(cross).setAttribute("class", "checked");
}
function addTextToItem() {
var num = window.prompt("What number do you want to change?", "1");
var txt = window.prompt("What text do you want to add to that number?");
document.getElementById(num).innerHTML = txt;
}
function createNewList() {
if (createList == "1") {
alert("You already created a new list.");
} else {
createList += 1;
var ul = document.createElement("UL");
var li1 = document.createElement("LI");
var li2 = document.createElement("LI");
var li3 = document.createElement("LI");
ul.setAttribute("id", "myUL");
li1.setAttribute("id", "one");
li2.setAttribute("id", "two");
li3.setAttribute("id", "three");
document.body.appendChild(ul);
ul.appendChild(li1);
ul.appendChild(li2);
ul.appendChild(li3);
}
}
function createItemListTwo() {
var li = document.createElement("LI");
var id = window.prompt("What is the word form of the number you are adding into list two?\n(No capitals)");
li.setAttribute("id", id);
document.getElementById("myUL").appendChild(li);
}
function crossOutListTwo() {
var cross = window.prompt("What is the word form of the number you are crossing out?\n(No capitals)", "one");
document.getElementById(cross).setAttribute("class", "checked");
}
function addTextToItemListTwo() {
var num = window.prompt("What is the word form of the number you want to add text to\n(No capitals)", "one");
var txt = window.prompt("What text do you want to put on that number?");
document.getElementById(num).innerHTML = txt;
}
h1 {
font-family: Calibri;
color: darkgreen;
}
p, li {
font-family: "Trebuchet MS";
color: blue;
}
button {
font-family: Tahoma;
color: orange;
border-radius: 2.5px;
margin-top: 10px;
}
li.checked {
text-decoration: line-through;
text-decoration-color: red;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="code.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Todo list</title>
</head>
<body>
<h1>To-do list</h1>
<button onclick="createNewItem()">Create an Item</button>
<br>
<button onclick="crossOut()">Cross Something Out</button>
<br>
<button onclick="addTextToItem()">Add Text to an Item</button>
<ol id="myOL">
<li id="1"></li>
<li id="2"></li>
<li id="3"></li>
</ol>
<button onclick="createNewList()">Create a New List</button>
<br>
<button onclick="createItemListTwo()">Create an Item for list 2</button>
<br>
<button onclick="crossOutListTwo()">Cross an Item Out</button>
<br>
<button onclick="addTextToItemListTwo()">Add Text to an Item</button>
</body>
</html>
我需要为每个用户生成一个新的保存密钥,因此当他们输入密钥时,它将恢复以前的状态。