首页 > 解决方案 > 显示 json 本地

问题描述

我一直在尝试通过单击将 JSON 数据从一个页面显示到另一个页面。

例如,用户单击图像并将相同的图像/文本传递到另一个页面。

这是我的代码

ygt.js

      <h2 class="pet-name">${pet.name}
      
      
      <h1 class="species">${pet.species}

      </div>
       <div></div></div>
      </div>
   </div>

  
`;
}

document.getElementById("app").innerHTML = `
   <h1 class="app-title">Kids
   ${petsData.map(petTemplate).join("")}
`;

标签: css

解决方案


您可以使用 localStorage 将值从一页传递到另一页。假设您在一页中有书,并且您想将书名传递到另一页。

在您的图书页面中,您可以添加如下函数:

function saveBook(bookName, link){
   localStorage.setItem("bookName", bookName):
   window.location.href = link
}

然后你可以在你的onclick事件中调用这个函数。

<div class="olay" onclick="saveBook('The Book','${pet.href}');" style="cursor: pointer;">

当有人点击这本书时,它会将值保存在 localStorage 中并重定向到您需要的页面。

在第二页中,您可以使用函数来检索保存的值:

var bookName = localStorage.getItem('bookName');

有关 localStorage 的更多信息:https ://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage


推荐阅读