我如何从一个页面制作一个按钮，以自动触发另一个页面的特定按钮？

Question

我正在为学校构建一个项目，但遇到了一个问题。我创建了一个电子商务网站，并在 store 页面底部创建了 cart。现在，当我单击产品按钮时，它已添加到购物车中。现在我为每个产品创建了一个带有描述的页面，我也有一个 添加到购物车 按钮，我怎样才能点击那个按钮然后那个自动转到商店页面并单击产品的特定按钮？

这是我的商店代码：

<img class="shop-item-image" src="imaginiproduse/p1.jpg">
<span class="shop-item-title">Busuioc</span>
<div class="shop-item-details">
      <span class="shop-item-price">.99</span>
      <button class="btn btn-primary shop-item-button " type="button" >ADD TO CART</button> <-- HERE IS THE BUTTON 
</div>
</div>

这是我的个人产品页面代码：

<div class="container">
    <img src="../imaginiproduse/p1.jpg" style="max-width: 250px;" >
    <div class="text">
        <h2>Busuioc</h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum nesciunt explicabo omnis dolores, sunt odio ducimus consequuntur distinctio quo et nemo molestiae saepe nostrum a iste! Modi amet ab dolore.</p>               
    </div>
    <p><button  type="button">ADD TO CART</button></p> <--- HERE IS MY OTHER BUTTON     
</div>

Answer 1

您如何向购物车添加元素以及如何在购物车中存储商品？

如果您使用原版 javaScript 并将购物车项目存储在数组中，则不能这样做。

您必须以可通过页面访问的方式存储购物车项目。例如：

您可以使用 cookie（服务器端）
你可以使用HTML5本地文件存储（客户端。临时）
使用一些像redux这样的状态管理包（可能需要nodejs）

Answer 2

如前所述，您有多种选择，通常这将通过 cookie 来完成（如果是敏感内容，则使用安全 cookie）旁注，cookie 并不总是在服务器端，可以在客户端设置并由客户端或服务器读取所以它可以双向工作，localstorage（仅由浏览器读取，但持久）或服务器端会话，服务器 cookie（将在服务器上呈现并生成链接等）

话虽如此，您现在似乎更像是通过客户端执行此操作并使用 localStorage。

你的问题措辞有点令人困惑，但如果我理解正确的话，你基本上想将 'add to cart' 与项目一起存储，这样他们就可以查看卡片、查看他们的项目，然后也可以单击从购物车等返回他们的项目

使用 localStorage 的流程可能是

用户查看商品详情页面
用户点击添加到购物车 --> 这会触发一个函数，将 itemID 附加到购物车 localstorage（localStorage 只能是一个字符串，因此您最终会在存储对象之前将其字符串化）可能类似于

//click action (jquery syntax)
$('.addToCart').on("click",()=>{
//add to cart clicked
//Grab localStorage first
let data = localStorage.getItem('cart');
//check if there is anything in it, otherwise don't stringigy
if ( data !== undefined && data !== "")
{
//Means there is an actual localStorage object called cart AND its not empty
//we can then proceed with stringifying it 
try{
//turn the localStorage into an object
data = JSON.parse(data);
//now that you have the object you will push the item ID to the array
data.push(itemID);
}catch(e){
//yikes, its not valid JSON
console.error(e)
}


}

})

我没有测试代码，但它可以让您了解流程，然后删除一个项目可以只是一个简单的弹出项目。

查看时，只需拉取 localStorage 项目，转换为数组并循环遍历它。您也可以在对象中存储更多项目，例如名称、ID、价格等，或者您可以运行这个想法反对 API 调用等

我如何从一个页面制作一个按钮，以自动触发另一个页面的特定按钮？

How i can make a button ,from a page , to automatically trigger a specific button from another page?

javascript

button