html - Html/Css 表和 Mysql 中的按钮问题

Question

我有一个小问题。现在我正在编写一个连接到 mysql 数据库的网站。 我创建了一个包含产品的表，这些产品存储在数据库中。每行都有一个按钮“添加到购物车”，但我如何才能准确地获得它的特定元素？我已经有了函数 addtoCart(string articleName) 但我不知道如何获取产品名称。

这是我目前所得到的:

<table id="Products">
              <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Description</th>
                <th>Price</th>
                <th>Stock</th>
              </tr>
    <% 

      Class.forName("com.mysql.jdbc.Driver");
      Connection  con = DriverManager.getConnection("jdbc:mysql://localhost:3306/shop", "root", "12345");
      Statement stmt = con.createStatement();
      ResultSet rs = stmt.executeQuery("SELECT* FROM products WHERE category='shisha'");

      while(rs.next()){
      int id = rs.getInt("articleID");
      String pname = rs.getString("productName");
      String description= rs.getString("description");
      float price = rs.getFloat("price");
      int stock = rs.getInt("stock");
      %>
              <tr>
                <td><%out.print(id);%></td>
                <td><%out.print(pname);%></td>
                <td><%out.print(description);%></td>
                <td><%out.print(price);%></td>
                <td><%out.print(stock);%></td>
                <td> </td>  
                <td><input type="text" placeholder="How much ?" name="quantity" required> </td>
                <td> <input class="button" type = "submit" value="Add to cart"> </td>
               </tr>
      <%
      }



      %>
      </table>   

所以它为每个产品生成一行，每个产品都有自己的按钮....我想调用函数 addtoCart(string articleName) 但如何获取按钮行的产品名称在?

Answer 1

使用 Jquery，您可以将类和数据属性添加到您的按钮，然后您可以像这样获取值。

<input class="button" data-product="<%out.print(pname);%>" type = "submit" value="Add to cart">

 $('.button').click(function(){

  var product = $(this).data("product");
   addtoCart(product);

 });

希望对您有所帮助。

谢谢