javascript - 使用 jquery 显示数据库结果的 php 循环中的特定文本

Question

我已经从数据库中选择了数据，并且循环了结果以将它们显示在我的页面上。我显示了 3 个结果。每个结果都有一个按钮，其 id 称为“减少”。当我单击此按钮时，应显示一个警报，其中包含包含警报按钮的项目的名称。我正在使用 jQuery 来实现这一点。

我的问题是，每当我单击该按钮时，仅显示结果数组中第一项的名称。其他两个结果中的按钮似乎不起作用。我做错了什么？

循环结果并显示数据库表中的项目的代码:

if(mysqli_num_rows($run) >= 1){
    while($row = mysqli_fetch_assoc($run)) {
        $name = $row['name'];
        $quantity = $row['quantity'];
        $price = $row['price'];
        $image = $row['image'];
        $category = $row['category'];
        $total = $price * $quantity;
        echo "<div class=\"post-container\">\n";
        echo "<div class=\"post-thumb\">\n";
        echo "<img src='$image'>\n";
        echo "</div>\n";
        echo "<div class=\"post-title\">\n";
        echo "<h4 style=\"font-weight:bold;\">\n";
        echo "<a href=\"view.php?name=$name&category=$category\" class=\"links\" target=\"_blank\">$name</a>\n";
        echo "<span id=\"deletion\">Delete</span>\n";
        echo "</h4>\n";
        echo "</div>\n";
        echo "<div class=\"post-content\">\n";
        echo "<ul style=\"list-style-type:none;\">\n";
        echo "<li>Cost Per Item: <span id=\"cost\">$price</span>/=</li>\n";
        echo "<li>\n";
        echo "Quantity: \n";
        echo "<button type=\"submit\" id=\"decrease\" class=\"glyphicon glyphicon-minus\" title=\"Decrease Quantity\"></button>\n";
        echo "\n";
        echo "<span id=\"cost\" class=\"quantity\">&nbsp$quantity&nbsp</span>\n";
        echo "\n";
        echo "<button type=\"submit\" id=\"increase\" class=\"glyphicon glyphicon-plus\" title=\"Increase Quantity\"></button>\n";
        echo "</li>\n";
        echo "<li>Total Cost: <span id=\"cost\">$total</span>/=</li>\n";
        echo "</ul>\n";
        echo "</div>\n";
        echo "</div>";
    }
}

这是 jquery:

$("#decrease").click(function(){
    var name = $(this).parent("li").parent("ul").parent("div.post-content").siblings("div.post-title").find("a").text();
    alert(name);
});

Answer 1

您的 HTML 标记无效，因为只能有一个具有给定 id 的元素 - id 必须是唯一的。您可以使用类来代替，例如 decrease 类将具有选择器 .decrease，它将与您的所有按钮相关。