在 Jquery done 方法中使用 localstorage

Question

我想在用户回答正确时在 .done 方法中设置一个本地存储。然后我想 get 那个本地存储对象并在 done 方法之外使用它。这怎么可能？以下是我正在尝试但没有成功的方法。

data.color是一个字符串

$.ajax({
    type: "POST",
    url: "validation.php",
    dataType: "json",
    data: $("input").serialize(),
}).done(function(data) {
 if (data.answer) { //if answer is correct
 localStorage.setItem("ColorStorage", data.color); //set a local storage with the variable data.color
    }
});

//outside of ajax
if (localStorage.getItem("ColorStorage") > 1)
    $("#result").append(localStorage.getItem("ColorStorage"));

Answer 1

您可以链接 .done 并等待项目设置：

$.ajax({
    type: "POST",
    url: "validation.php",
    dataType: "json",
    data: $("input").serialize(),
}).done(function(data) {
 if (data.answer) { //if answer is correct
 localStorage.setItem("ColorStorage", data.color); //set a local storage with the variable data.color
    }
}).done(
if (localStorage.getItem("ColorStorage") > 1)
    $("#result").append(localStorage.getItem("ColorStorage"));
);

您需要链接 .done 函数以确保您的项目已设置。如果您将它留在 ajax 回调之外，您将不确定 ajax 调用是否已返回并成功设置您的 localStorage 项目。您将不得不等待它，然后触发您的 getItem 函数。

Answer 2

来自 localStorage.getItem("ColorStorage") 的 returned 值是 String，因此将其与例如> 1 之类的数字无效。

你可以，例如省略 > 1 如果该项目存在，它将 return true。

if (localStorage.getItem("ColorStorage"))  {

}

你当然也可以检查它的length，虽然在你确定它存在之后，否则如果它不存在你会得到一个错误。

if (localStorage.getItem("ColorStorage") && localStorage.getItem("ColorStorage").length > 1)  {

}

另请注意，如果您在 AJAX 调用 done 之前进行该调用，该项目将不存在，但使用上述代码示例不会导致运行时错误。

在 Jquery done 方法中使用 localstorage

Using localstorage inside Jquery done method

javascript

jquery

local-storage

web-storage