javascript - 尝试从数组中删除一个元素并将数组 "refresh"放在 Javascript 的网页上

Question

这里是 JavaScript 新手。 我制作了一个 JavaScript 应用程序，用于从列表数组中添加和删除项目元素。 添加功能。 删除功能不起作用。 然而，我认为也许项目元素正在从数组中删除；该数组没有在网页上“刷新”。 有人知道如何让它发挥作用吗？ 谢谢， 伊丽莎

HTML:

<p>GROCERY LIST-INATOR</p>
<p>Click the button to add an item to grocery list.</p>

<button onclick="addItem()">Add item</button>
<button onclick="deleteItem()">Delete item</button>

<p id="list"></p>

JS:

var list = [];

function addItem (){
    var name = prompt("Enter item name:");
    list.push(name);
    var today = Date();
    var string = "Created on " + today + "<br>" + " My Grocery List: <br>";
    for (var key in list){
        string += "- " + list[key] + "<br>";
    }
    document.getElementById("list").innerHTML = string;
};

function deleteItem (){
    var item = prompt("Enter item name:");
    for(var i = list.length - 1; i >= 0; i--) {
        if(list[i] === item) {
        list.splice(i, 1);
    }
}
   document.getElementById("list").innerHTML = string;
};

http://jsfiddle.net/elizaway/9d0376t1/

Answer 1

您没有在第二个函数中更新字符串变量。尝试在使用字符串变量之前在第二个函数中添加字符串相关代码，然后就完成了。

var string = "Created on " + today + "<br>" + " My Grocery List: <br>"; 
for (var key in list)
  { 
    string += "- " + list[key] + "<br>"; 
   }

上面的代码位于 for 循环和此代码之间。

document.getElementById("list").innerHTML = string;