0

我的应用程序按预期工作,直到我添加了存储在 localStorage 中的项目的“DELETE”方法。

我有这个带有字符串的 HTML 代码:

<div>
    <div ><input type="text" id="manuallyName" name="manuallyName" placeholder="Medicine Name, Strength & Form..." /></div>
        <div class="ui-grid-a" style="padding:15px;">
            <div class="ui-block-a"><input id="manualClear" type="Button" data-icon="delete" data-iconpos="left" value="Cancel" /></div>
            <div class="ui-block-b"><input id="manuallyAdd" type="button" data-icon="cross" value="Add" /></div>
        </div>
</div>

当按下“添加”按钮时,将调用以下脚本:

$(document).ready(function () {
        $('#manuallyAdd').click(function () {
            if ($("#manuallyName").val() != "") {

                var length = storage.length;
                var number = storage.length;

                if (length >= number) {
                    number++;
                    var key = "Medicine" + number.toString();
                    var value = $("#manuallyName").val();
                    storage.setItem(key, value);
                }

                    document.getElementById("manuallyName").value = "";
                    return true;
            }
            else {
                alert('Please Provide Medicine Name')
                return false;
            }
        })
    });

这个脚本工作正常,它基本上检查存储长度并根据存储大小生成键,然后将textfield内容添加到值中并存储它。

保存的项目然后由另一个脚本显示在一个listviewwith中。id="medList"(我不会添加脚本以节省空间,但如果需要,请发表评论,我会添加它)。

以下脚本负责从listview和中删除项目localStorage

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

它获取存储在 上的“密钥”listview并相应地删除它。

现在我的问题依赖于从键中删除的项目localStorage变得不一致并且当$('#manuallyAdd').click(function ()再次调用时,它将计算所有内容,如果已经存在类似的键,它将替换它(可悲的是我不需要它)。

让我解释一个例子:

我存储了以下内容:

Key = Medicine1 - Value = a
Key = Medicine2 - Value = b
Key = Medicine3 - Value = c

在上面的 listview 上Medicine2被删除,只留下Medicine1and Medicine3

当我尝试添加另一种“药物”时,我希望会Key = Medicine4 - Value = New Medicine出现,但它会存储在Medicine3摆脱旧值并存储新值的过程中。

我相信这是由于if statement我已经准备好了,而且我似乎没有找到或解决一种不同的方法来为我提供正确的解决方案。

我尝试添加一条语句来检查密钥是否已经存在并提供不同的密钥,但这仅在另一个项目从列表中删除之前有效。

任何指针或想法将不胜感激。

抱歉,问题很长,但我尽力解释。如果还有什么不清楚的,请告诉我。

4

1 回答 1

1

我没有使用过 localStorage,但是这段代码看起来很奇怪:

var length = storage.length;
var number = storage.length;

 if (length >= number)...

这不总是正确的,因为storage.length = storage.length

无论如何,也许你可以做这样的事情:

$(document).ready(function () {
    if (storage.getItem("medID") === null) 
           storage.setItem("medID", "0");

    $('#manuallyAdd').click(function () {
        if ($("#manuallyName").val() != "") {

            var number = parseInt(storage.getItem("medID"));
            number++;
            var key = "Medicine" + number.toString();
            var value = $("#manuallyName").val();
            storage.setItem(key, value);
            storage.setItem("medID", number.toString());

            document.getElementById("manuallyName").value = "";
            return true;
        }
        else {
            alert('Please Provide Medicine Name')
            return false;
        }
    })
});
于 2013-11-14T19:25:41.500 回答