javascript - PHP 生成的表格按钮 onclick 仅适用于第一个

Question

我有一个从 PHP 生成的 HTML 表(来自 SQL 查询的结果):

echo "<table border=\"5\"><tr><th>Codice</th><th>Titolo</th><th>Anno Creazione</th><th>Materiale</th><th>Altezza</th><th>Peso</th><th>Museo</th></tr>";
while($row = mysqli_fetch_assoc($results)) {
        echo "<tr><td>".$row["Codice"]."</td><td>".$row["Titolo"]."</td><td>".$row["Anno_creazione"]."</td><td>".$row["Materiale"]."</td><td>".$row["Altezza"]."</td><td>".$row["Peso"]."</td><td>".$row["Museo"]."</td><td><button id=\"modifica\" type=\"button\">Modifica</button></td><td><button id=\"cancella\" type=\"button\">Cancella</button></td></tr>";
}
echo "</table>";

然后，我有这个 JQuery:

$("#cancella").click(function(){
    if(confirm("Vuoi davvero eliminare questi dati?")){
        var codice = <?php echo json_encode($cod); ?>;
        var tipo = <?php echo json_encode($tipo_opera); ?>; 
        window.location.href = "delete.php?codice="+codice+"&tipo="+tipo;
    }
 });

此点击功能仅适用于第一行的“删除”按钮。为什么？

Answer 1

id 是唯一的，因此只能分配给一个元素。

使用类。

<button class=\"cancella\" type=\"button\">Cancella</button>

$(".cancella").click(function(){
 // Do Something.
});

替代方案:

<button type=\"button\" onclick=\"cancella()\">Cancella</button>

function cancella(){}