如何使用JavaScript将数据从一个HTML页面传递到另一HTML页面 [英] How can i pass data from one HTML page to another using JavaScript

问题描述

我很难将数据从一个HTML页面传递到另一HTML页面.我正在建立一个网上商店，我在页面上有我的物品以及用户可以选择的按钮.而且我有第二个页面，这是我的结帐页面.我要这样做，以便当用户单击项目页面中的项目时，它将被写在结帐页面上的DOM上.我遇到的2个主要问题:

Im having a hard time passing data from one HTML page to another. Im building an online store, i have one page with my items, and with their buttons for users to pick. and i have seconde page that is my checkout page. I want to make it so that when the user clicks on the items in the items page it will get written on the DOM on the checkout page. 2 main issues im having:

1，我具有项目页面中按钮的变量和eventListerner，并且我也要在结帐页面中的表中具有要使用DOM编写的表的变量.在项目页面上输入im时，当 console.log 时，我的表变量为null.当我在结帐页面上时，我得到:

1 inside the javascript file i have for both pages, i have the variables and eventListerner for the buttons from the items page, and i also have the variable for the table in the checkout page where i want to write with the DOM. When im on the items page, my table variable comes as null when console.log. And when im on the checkout page i get:

itemsScript.js:44 Uncaught TypeError: Cannot read property 'addEventListener' of null
    at addEventListeners (itemsScript.js:44)
    at Array.map (<anonymous>)
    at itemsScript.js:46 

因此，我发现他们无法正常通信.

So i see that they are not comunicating properly.

2我应该将按钮的值和名称放在哪里?也许是data.js文件，如何从单击的按钮中获取此数据?

2 where should i put the value and names of the items, on the buttons themself? maybe a data.js file, and the how could i get this data from the button that was clicked?

推荐答案

结帐页面是一个完整的新网站还是在您的产品网站内实现?

Is the checkout page a complete new site or implemented inside your product site?

如果有一个完整的新站点，您将触发一个新请求.一种方法是使用本地存储/缓存，如前所述.这可能是最好的解决方案，这样您就不会在正常的网站重新加载中丢失任何物品.

In case of a complete new site you will trigger a new request. One way is using local storage/cache as one already mentioned. This would probably the best solution so you wont lose any items on a normal site reload.

如果直接在产品站点上实施，请查看ajax.这可能会对您有所帮助.

In case of a implemtation direct on the product site have a look at ajax. This might help you.

这篇关于如何使用JavaScript将数据从一个HTML页面传递到另一HTML页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！