Question

这是一个难题，因为我不确定如何说出来。我正在使用HTML5和JS创建一个购物车网站，我已经将其中的大部分内容都删除了，但需要帮助解决一个重要问题。

目前，我的“立即购买”按钮位于链接到1页面的标签中，用户可以在其中输入信息并进行购买，此页面称为“结帐”。我想要这个“结账”页面显示他想要购买的商品的价格。

对于ex）用户点击价值10.00美元的图书并点击立即购买按钮。此按钮会将他发送到确认页面，其中将显示填写表格，但页面不显示他正在购买的商品的价格。

这就是我的问题所在。除了为每个产品制作不同的页面（我只有9个产品）之外，我想不出任何解决方案。

另外，如果它不是很明显，我仍然是JS的初学者。任何帮助将不胜感激，帮助我弄清楚如何在每个特定项目的“结帐”页面上显示价格，而无需创建9个单独的页面。谢谢。

Answer 1

最好的方法是使用一些服务器端解决方案。客户端将其表单发送到您的服务器，在该服务器上评估表单并呈现相应的html页面。

唯一的另一种方法是使用cookie或本地存储 - 但这相当丑陋。

你肯定应该阅读一些关于php和mysql的教程，但我会粗略概述一下如何实现这一目标。

您在页面上提供了一个表格，如下所示：

<form method="post" action="your-serverside-phpscript-that-processes-your-form.php>
   How many Ipads you wanna buy:<input type="number" name="ipads">
   <button type="submit">
</form>

现在在服务器端，您的php脚本可以评估表单。

所有表单字段都存储在$_POST数组中。（$ _POST [“ipads”]）获取用户在表单中输入的值。您不需要将这些值存储在数据库中。您评估表单值并使用相应数据（总价格）创建结帐页面。现在，用户提交了checkout-form，您可以再次处理并存储在数据库中。

我不会写下（sry，太累了）这个服务器端部分如何工作，那里有大量的内容，只是搜索谷歌的php + mysql。

Answer 2

如果我理解正确，你会问如何在Javascript中存储一个可以被多个页面检索的变量。

执行此操作的规范方法是使用 Cookie 。本机cookie库相当混乱，因此我建议使用cookie库like this。

但是，由于您的问题已标记为html5，因此您可能会对此sessionStorage HTML5解决方案持开放态度，这比Cookie要简单得多。

sessionStorage.setItem("price", 100);
var price = sessionStorage.getItem("price");

Answer 3

由于您希望将这些数据全部保存在客户端，我建议您查看Amplify.Store。在完全披露中，我目前受雇于公司 - 但它很棒，而且是免费的。

保存数据非常简单：

amplify.store( 'cart', { name: 'Book Title', price: 10.99 } );

要稍后访问此内容，您只需致电：

amplify.store( 'cart' );

这将返回您的对象，您可以从中获取当前加载的所有产品。 Amplify将评估您的系统并确定哪种存储方法最佳，并使用它。这会消除你所有的猜测工作，让你只是做你想做的事情。

请理解，虽然保持数据客户端方便，但它并不安全。在处理交易和财务问题时，您应该始终将数据从消费者手中拿走。

通常，这样的数据存储在服务器端，会话，数据库或两者的组合中。但是，如果您了解风险，并且您的模型允许这种类型的持久性，那么无论如何都可以随意使用它作为解决方案。

在不同页面上显示JS var

3 个答案: