66

我正在创建一个包含网站上出售的产品的页面。我想在每个产品附近添加一个“添加到购物车”按钮，列出的标记类似于：

<h4 class="productHeading">Product Name 1</h4>
<div>
  Extra information on the product 1.
</div>
<h4 class="productHeading">Product Name 2</h4>
<div>
  Extra information on the product 2.
</div>
 ...

由于提交输入将有不同的名称（包括产品的代码），最大的问题是：我应该将整个产品列表包装在一个表单中，还是应该为每个产品创建一个表单？在代码中：

<form method="post" action="process.php">
  <h4 class="productHeading">Product Name 1</h4>
  <div>
    Extra information on the product 1.
    <input type="submit" name="submit1" value="Add to Cart">
  </div>
  <h4 class="productHeading">Product Name 2</h4>
  <div>
    Extra information on the product 2.
    <input type="submit" name="submit2" value="Add to Cart">
  </div>
</form>

或者……</p> 

<h4 class="productHeading">Product Name 1</h4>
<div>
  Extra information on the product 1.
  <form method="post" action="process.php">
    <input type="submit" name="submit1" value="Add to Cart">
  </form>
</div>
<h4 class="productHeading">Product Name 2</h4>
<div>
  Extra information on the product 2.
  <form method="post" action="process.php">
    <input type="submit" name="submit2" value="Add to Cart">
  </form>
</div>

哪一个是最佳实践？有什么理由不使用其中一种，还是我做错了？

4

1 回答 1

110

最佳实践：每个产品一个表格绝对是要走的路。

好处：

  • 它将为您省去必须解析数据以确定点击了哪个产品的麻烦
  • 它将减少发布的数据的大小

根据您的具体情况

如果您只打算拥有一个表单元素，在这种情况下是一个submit按钮，那么一个表单应该可以正常工作。

我的建议 为每个产品做一个表格，并将您的标记更改为：

<form method="post" action="">
    <input type="hidden" name="product_id" value="123">
    <button type="submit" name="action" value="add_to_cart">Add to Cart</button>
</form>

这将为您提供更清洁和可用的POST. 没有解析。并且它将允许您在将来添加更多参数（尺寸、颜色、数量等）。

注意：<button>使用vs.没有技术上的好处<input>，但作为一名程序员，我发现使用它action=='add_to_cart'比action=='Add to Cart'. 此外，我讨厌将演示与逻辑混为一谈。如果有一天您认为按钮说“添加”更有意义，或者如果您想使用不同的语言，您可以自由地这样做，而不必担心您的后端代码。

于 2012-01-03T13:13:09.487 回答