Question

我的本地商店有很多价值，我想删除其中的一些。当我单击创建的动态卡时，应正常和在本地将其删除。我通常可以删除它，但不能从本地删除它。

本地存储事件非常令人困惑，并且没有很多说明性资源。至少我找不到它。谢谢您的帮助。

$('#field').keypress(function (e) {
    if (e.keyCode === 13 && !e.shiftKey) {
        e.preventDefault();

        if ($('#field').val() === '') return false;

        let comment = {
            card: $('#field').val(),
            id: generateGUID()
        };
        $('#field').val('')
        var store = JSON.parse(localStorage.getItem('todo')) || [];
        store.push(comment);
        localStorage.setItem('todo', JSON.stringify(store));
        $(this).val('');
        displayComment(comment);
    }
});

function displayComment(comment) {
    var html = $(`<div class="card" data-id="${comment.id}"><h5>${comment.card}</h5></div>`);
    $('.yorum').append(html);

    $('.yorum').find(html).click(function () {
        $(html).remove();
    });

}


var store = JSON.parse(localStorage.getItem('todo')) || [];
store.forEach(displayComment);

Answer 1

尝试使用localStorage.removeItem('ITEM_NAME')对象的localStorage方法。

以下是在localStorage

中创建，获取和删除项目的示例

localStorage.setItem('aaa','1231')  //undefined
localStorage.getItem('aaa')         //"1231"
localStorage.removeItem('aaa')      //undefined
localStorage.getItem('aaa')         //null

以下是您的案例的代码示例：

function displayComment(comment) {
    var html = $(`<div class="card" data-id="${comment.id}"><h5>${comment.card}</h5></div>`);
    $('.yorum').append(html);

    $('.yorum').find(html).click(function () {
        $(html).remove();
        var arr = JSON.parse(localStorage.getItem('todo'));
        for(var i=0;i<arr.length;i++)
          {
            if(arr[i].id=this.getAttribute('data-id'))
            {
              arr.splice(i,1);
              break;
            }
          }
        localStorage.setItem('todo', JSON.stringify(arr));
    });

}

Answer 2

在点击处理程序内，您还必须获取已解析的本地存储值，然后调用splice（index，1），将条目号作为“ index”传递。

类似...

$('#field').keypress(function (e) {
    if (e.keyCode === 13 && !e.shiftKey) {
        e.preventDefault();

        if ($('#field').val() === '') return false;

        let comment = {
            card: $('#field').val(),
            id: generateGUID()
        };
        $('#field').val('')
        var store = JSON.parse(localStorage.getItem('todo')) || [];
        store.push(comment);
        localStorage.setItem('todo', JSON.stringify(store));
        $(this).val('');
        displayComment(comment, store.length-1);
    }
});

function displayComment(comment, index) {
    var html = $(`<div class="card" data-id="${comment.id}"><h5>${comment.card}</h5></div>`);
    $('.yorum').append(html);

    $('.yorum').find(html).click(function () {
        $(html).remove();
        var store = JSON.parse(localStorage.getItem('todo')) || [];
        store.splice(index, 1);
        localStorage.setItem('todo', JSON.stringify(store));
    });

}


var store = JSON.parse(localStorage.getItem('todo')) || [];
store.forEach(displayComment);

Answer 3

localStorage.removeItem(key);

根据要求替换密钥

Answer 4

所有答案都很好。您怎么也可以这样：

localStorage[key] = undefined;

因为本地存储是键值对象

如何从LocalStorage删除特定项目

4 个答案: