1

我有一个应用程序读取存储在 localStorage 中的项目,并在<li />页面“加载”时显示它。

listview 包含一个拆分按钮,当按下它时,它会从列表中删除相关项目;这是我的目标的一部分,在互联网上环顾四周,我试图找到一种方法,所以这个“删除/删除”功能<li />也从 localStorage 中删除了选定的项目,但由于某种原因,我的脚本如下删除随机项目。

$(document).ready(function () {
        window.addEventListener('load', OnStorage, false);

    });

    function OnStorage(event) {
        if (window.localStorage) {
            var key, value;
            // loop through local storage
            for (var i = 0; i < localStorage.length; i++) {
                // retrieve the key
                key = localStorage.key(i);
                // set the field from the key
                value = localStorage.getItem(key);

                $("#medListDiv").show();
                var text = '<a href="#"><h2>' + value + '</h2>' + '<a href="#" class="del">Delete</a></a>';
                $('<li />', {
                html: text
                }).appendTo('ul.medList');                  
            }
            $('ul.medList').listview('refresh')
        }
    }

    //Deletes items from the medicine List
    $('ul').on('click', '.del', function (el) {
        $(this).closest('li').remove();
        localStorage.removeItem(key); //Where problem relies
        $('ul.medList').listview('refresh');
    });

我相信这与key错误有关,但我无法想办法让脚本从所选项目中获取正确的密钥。或者,如果有一种方法可以通过单独获取值来删除该项目?(怀疑它,因为我发现只能通过操纵钥匙来完成)。

请任何建议将不胜感激。

4

2 回答 2

2

将您的密钥存储在锚标记的属性中

     var text = '<a href="#"><h2>' + value + '</h2>' + '<a href="#" key="'+key+'" class="del">Delete</a></a>';
            $('<li />', {
            html: text
            }).appendTo('ul.medList'); 

并在点击事件中引用该属性

$('ul').on('click', '.del', function (el) {
    $(this).closest('li').remove();
    var key = $(this).attr('key');
    localStorage.removeItem(key); //Where problem relies
    $('ul.medList').listview('refresh');
});

希望这可以解决您的问题。

于 2013-11-14T13:08:03.427 回答
1

你应该得到键值,你在 ui 上执行点击事件。可以说每个李都像

<li data='key'>....</li>

// 对本地存储中键名的键引用,当点击函数时,您可以获得键值,如

var key = $(this).closest().attr("data");
localStorage.removeItem(key);
于 2013-11-14T13:06:54.297 回答