Javascript 使用带按钮的JS函数显示变量

我之前问过一个类似的问题，但后来意识到我需要使用javascript来实现这一点。我的情况如下：

我有一个购物网站，有产品x和一个“购买”按钮。“购买”按钮链接到结帐页面，以及一个javascript函数，该函数有两个全局变量，分别称为“产品”和“价格”。我想在结帐页面上显示这两个变量，该页面将根据用户按下的“购买”按钮自动更新

var x = "iPhone";
var xprice = 199.99;
var product;
var price;

function productX(){
    product = x;
    price = xprice;
}

^^^^不起作用。它只会在变量写入的区域中传递“未定义”。如果有人能理解我的意图，他们能帮我吗

我只是希望确认页面显示用户要购买的产品，以及价格，具体取决于用户按下的购买按钮。我似乎无法使用JavaScript使其正常工作。我不想使用PHP、数据库或cookies

---

谢谢

如果要将值传递到第二页，需要将它们附加到第二页链接的URL中

假设你的第二页叫做结帐。您可以按如下方式链接到签出页面：

<a href="checkout">Checkout</a>

第二个页面加载了一个字符串，您需要通过将字符串值拆分为数组从URL中检索这些值

请看这里：

---

好吧，考虑到您试图在没有PHP或cookie的情况下将数据从一个页面传递到另一个页面，这将是很困难的

假设您有一个带有“购买按钮”的表单，可以转到下一页，您可以设置表单的action=“GET”，并且表单中有两个隐藏字段：

<input id="productInput" type="hidden" name="prpduct" value="" \>
<input id="priceInput" type="hidden" name="price" value="" \>

这将让javascript通过GET将值传递到下一页

不可否认，javascript并不是为这个目的而设计的。因此，要在下一页中显示这些值，必须使用如下函数：

function GetFromUrl(url, key) {
var pairs = url.substring(url.indexOf('?') + 1).split('&');
for (var i = 0; i < pairs.length; i++) {
  var pair = pairs[i].split('=');
  if(key == pair[0])
     return pair[1];
}
return null;
}

从这里开始，您必须执行一些document.getElementById（）操作来修改实际页面

---

对不起，如果我没有很好地描述…

我想购买区和结账区是两个不同的页面？不仅仅是在HTML中显示/隐藏/交换的1？@mj_-正确。使用一个JS页面将两个HTML5页面分开。在我看来，您在第1页上设置了一对全局变量。那么，如何将这些变量传递到第2页？我的理解是，当你转到第2页时，你将离开第1页的范围，因此这些值将消失。如何？我还是一个初学者。我假设将变量设置为全局将允许它访问两个页面。不，一旦加载了一个新页面，所有JavaScript都将重新加载。我将编辑我的帖子，并为您编写一些基本代码。

function productX(){
document.getElementById("productInput").value = x;
document.getElementById("priceInput").value = xprice;
}

function GetFromUrl(url, key) {
var pairs = url.substring(url.indexOf('?') + 1).split('&');
for (var i = 0; i < pairs.length; i++) {
  var pair = pairs[i].split('=');
  if(key == pair[0])
     return pair[1];
}
return null;
}

product = GetFromUrl(window.location, "productInput");
price = GetFromUrl(window.location, "priceInput");