javascript - 具有相同 id 的 jQuery 多个按钮

Question

这个问题已经有答案了:

How can I apply a jQuery function to all elements with the same ID? (4 个回答)

已关闭 5 年前。

我遇到了多个具有相同 id 的按钮的问题。当我单击其中一个按钮时，它仅适用于 id=1(当我在文本字段中输入内容并按任意按钮时，在每种情况下仅更新 id=1 的记录)。如何解决这个问题？

div id="ShowPrace">
<?php
try {
  $stmt = $pdo->prepare("SELECT * FROM prace");
  $stmt->execute(array());
  $count = $stmt->rowCount();
  while($row = $stmt->fetch(PDO::FETCH_ASSOC)){

?>

  <textarea class="form-control" name="id" rows="1" id="id"><?php echo $ind; ?></textarea>
  <div class="form-group">
    <label for="img">Link do obrazka:</label>
    <textarea class="form-control" name="link" rows="1" id="link"><?php echo $row['img']; ?></textarea>

  </div>
  <div class="form-group">
    <label for="title">Tytuł:</label>
    <textarea class="form-control" name="title" rows="1" id="title"><?php echo $row['title']; ?></textarea>
  </div>
  <div class="form-group">
    <label for="opis">Opis:</label>
    <textarea class="form-control" name="opis" rows="1" id="opis"><?php echo $row['opis']; ?></textarea>
  </div>
  <div class="form-group">
    <button type="submit" id="poprawa" name="poprawa" class="btn btn-primary"> Popraw</button>
</div>
  <?php
    }

  } catch (\Exception $e) {
      echo "Wystąpił nieoczekiwany błąd!";
  }
  ?>

还有 JS:

("#poprawa").click(function(){

var link = $("#link").val().trim();
var title = $("#title").val().trim();
var opis = $("#opis").val().trim();
var id = $("#id").val().trim();

$.ajax({
  url: 'update_prace.php',
  type: 'POST',
  data: {link:link, title:title, opis:opis, id:id},
  success: function(response){
    if(response == 0){
      alert("error");
    }
    else{
      alert("Poprawione!");
      location.reload();
    }
  }
});

});

Answer 1

ID是唯一的，不能重复。您应该在 DOM 中使用 class 并相应地更改您的选择器

HTML:

<button type="submit" name="poprawa" class="btn btn-primary poprawa"> Popraw</button>

JS:

$(".poprawa").click(function(){

例如。