[英]How can i pass data from one HTML page to another using JavaScript
Im having a hard time passing data from one HTML page to another.我很难将数据从一个 HTML 页面传递到另一个页面。 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.
我想这样做,以便当用户单击项目页面中的项目时,它将被写入结帐页面的 DOM 上。 2 main issues im having:
我有两个主要问题:
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. 1 在 javascript 文件中我有两个页面,我有来自项目页面的按钮的变量和 eventListerner,我还有我想用 DOM 编写的结帐页面中的表的变量。 When im on the items page, my table variable comes as null when
console.log
.当我在项目页面上时,我的表变量在
console.log
时为 null 。 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 where should i put the value and names of the items, on the buttons themself? 2 我应该将项目的值和名称放在按钮本身的哪里? maybe a data.js file, and the how could i get this data from the button that was clicked?
也许是一个 data.js 文件,我如何从被点击的按钮中获取这些数据?
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.
这可能是最好的解决方案,因此您不会在正常站点重新加载时丢失任何项目。
In case of a implemtation direct on the product site have a look at ajax.如果直接在产品网站上实现,请查看 ajax。 This might help you.
这可能会帮助你。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.