无法跨域附加本地存储数据

Question

我有一个大问题，几乎没有时间解决它。我正在为属性搜索创建我的第一个移动应用程序作为一个大学项目（它不是基于不动产）我尝试使用不同的键它不起作用，我不了解基础知识。基本上我有一个 Jquery 移动应用程序，其中包含许多外部页面，其中包含属性的详细信息，这些页面具有相同的 ID 但在不同的文档上，当用户单击按钮保存时，我想要标题以及页面的 url 保存在本地存储中，并由名为我的收藏夹的第三个页面检索。我遇到的问题是，当我进入每个页面并单击保存时，它会覆盖本地存储中已经存在的内容，并且似乎每个页面都有自己的存储空间，因此我的收藏夹页面始终只有一个收藏夹（最新的一个），而不是每次单击保存时都会附加一个最喜欢的列表。这是我的代码：

<div data-role="header" id="samplePlacePage_hd">
    <h4 id="hutRef">add#redHut456</h4>
</div>

<div data-role="main" id="samplePlacePage_cont">

    <div id="image">
        <a href="#"><img src="images/redhut.jpeg" height="200px" width="100%" alt="Hut"></a>
    </div>

    <div id="place_title">
        <p id="hutHeading">Stunning Red Hut in Central Red Beach</p>
    </div>
    <div>
        <h4 style="float: left;">Rent: 50pw</h4>
        <h4 style="float: right;">Deposit: 5500</h4>
    </div>

（两个页面上的代码相同）这是我在脚本文件中的函数：

$(文档).on("pagecreate",函数(参数){

var favoritesPlaces = [];
var heading = document.getElementById('hutHeading').innerText;
var ref = document.getElementById('hutRef').innerText;
var refLink = ref.replace("add#","");

document.getElementById('hutFav').onclick = function () {
    var newFav = {
        title: heading,
        link: refLink
    };
    favoritesPlaces.push(newFav);
    console.log(favoritesPlaces);
    localStorage.setItem("favorites",JSON.stringify(favoritesPlaces));
}

})

请帮忙

谢谢

Answer 1

您还有两个注意事项：检查收藏夹尚未添加，并允许用户在您网站的页面上打开多个选项卡 - 将一个页面添加为收藏夹不应干扰将其他页面添加为收藏夹最喜欢的。不要忘记，如果本地存储项不存在，请创建一个新的:)

基本上我建议检索本地存储、检查重复项、更新和保存回本地存储都发生在一个单击处理程序中，例如通过重新排列代码并添加几行：

$(document).on("pagecreate",function () {
    document.getElementById('hutFav').onclick = function () {

        var favoritesPlaces = localStorage.getItem("favorites");
        var heading = document.getElementById('hutHeading').innerText;
        var ref = document.getElementById('hutRef').innerText;
        var refLink = ref.replace("add#","");
        var newFav = {
            title: heading,
            link: refLink
        };

        favoritesPlaces = favoritesPlaces || '[]';    // string
        favoritesPlaces = JSON.parse(favoritesPlaces); // array
        if( !favoritesPlaces.some( fave => fave.link === refLink)) {
            favoritesPlaces.push( newFav)
            console.log(favoritesPlaces);
            localStorage.setItem("favorites",JSON.stringify(favoritesPlaces));
        }
        else {
           console.log("already a favorite");
        }
    }
})

（已测试）

请注意，在任何页面上清除 localStorage 都会为网站上的所有页面清除它。一旦清除，它在所有页面上都被清除，不再有收藏夹，任何页面都可以再次添加而不会重复。如果需要 "remove this page from favorites" 按钮，则需要编写一个新函数来实现。

无法跨域附加本地存储数据

Unable to append local storage data across the domain

javascript

storage

local