如何防止在本地存储中存储重复值?

时间:2014-12-21 22:09:54

标签: javascript jquery html json

我不确定如何解释这一点但基本上我希望用户在尝试保存已存在于本地存储中的数据时收到警报,即用户点击保存按钮将数据保存到收藏夹(本地存储)。但是当它们第二次尝试时应该这样说#34;这已经保存了,除非你从存储器中删除了数据,否则你无法再次保存。我可以在用户单击按钮保存数据后显示存储中的内容。我试图在html中执行此操作并使用具有存储数据的外部json文件,然后将其保存到浏览器的本地存储中。仅允许用户保存属性html页面的数据,例如仅保存一次。我尝试切换我的if和else条件,但我无法让它工作。

Javascript代码

$(".save").on("click", function() {
console.log("Saving property id to local storage");
try {
    $(this).attr('disabled', true);

    var propIdToAdd = $(this).closest("p").attr("id");

    var myFavouriteProp = JSON.parse(localStorage.getItem("data"));

    if (data.Properties.id == myFavouriteProp) {
        alert("Same property is already favourited!");
    } else(myFavouriteProp == null)
    myFavouriteProp = [];
    myFavouriteProp.push(propIdToAdd);

    localStorage.setItem("data", JSON.stringify(myFavouriteProp));
} catch (e) {
    if (e == QUOTA_EXCEEDED_ERR) {
        console.log("Error: Local Storage limit Exceeded");
    } else {
        console.log("Error: Saving to Local Storage");
    }
}

});
$("#viewFavourites").on("click", function() {
console.log("Restoring array data from local storage");

myFavouriteProp = JSON.parse(localStorage.getItem('data'));
var output = "<ul>";
if (myFavouriteProp != null) {
    for (var i = 0; i < data.Properties.length; i++) {
        for (j = 0; j < myFavouriteProp.length; j++) {
            if (data.Properties[i].id == myFavouriteProp[j]) {
                output += "<li>" + data.Properties[i].id + "</li>";
            }
        }
    }
}
output += "</ul>";
document.getElementById("placeholder").innerHTML = output;
});
});

我没有指出这一点,但是,如何让它查看我的所有身份?即prop1,prop2。我的保存功能当前覆盖存储在本地存储中的旧值。但是我的旧保存功能允许我显示以下所示的所有ID代码:

    $(".save").on("click", function(){
  try{
      $(this).attr('disabled',true);

      var propIdToAdd = $(this).closest("p").attr("id");

      var myFavouriteProp = JSON.parse(localStorage.getItem('data'));
      if (myFavouriteProp == null) {
          myFavouriteProp = [];
      }
      myFavouriteProp.push(propIdToAdd);

      localStorage.setItem('data', JSON.stringify(myFavouriteProp));
  }
  catch(e) {
      if (e == QUOTA_EXCEEDED_ERR) {
          console.log("Error: Local Storage limit exceeds. ");
      }
      else {
          console.log("Error: Saving to local storage.");
      }
  }
  });

此外,当我尝试添加if (data.Properties.id == myFavouriteProp[0])时,它会阻止我的按钮工作。单击“保存”按钮,然后单击“查看”按钮后,不显示任何内容。如果没有[0],它将显示警告框以及存储中包含的内容。但就像我说的那样,我当前的代码(不是旧代码)会覆盖旧数据并用新数据替换它。它不应该这样做。它应该允许我显示prop1,prop2等的id值。覆盖值id prop1后,它本身不是prop2。它们不应该覆盖,因为它们是不同的ID。

1 个答案:

答案 0 :(得分:0)

在我看来,当你保存时,你的myFavouriteProp变量是一个包含一个元素propId的数组。基本上在JSON中,它看起来像[2]

if (data.Properties.id == myFavouriteProp)中,您将data.Properties.id(我假设是一个整数)与myFavouriteProp进行比较,myFavouriteProp是一个数组(您正在进行比较2 == [2])。这永远不会成真。

我会将比较更改为if (data.Properties.id == myFavouriteProp[0]),看看它是否适合您。这将比较整数值和整数值,并且应该按照您期望的方式工作。