php - 只打开我想要的 div(jquery)

Question

标题可能具有误导性，但我会尽力解释一下。 My table of users当我点击十字时，我只想打开带有 id 的 div，例如 # in table(id=1, id=2...)

这是我的 PHP 代码:

$select = "SELECT ... from ...";
$data = mysqli_query($connect, $select);
$count = 0;
echo "<table>
        <tr>
            <th>#</th>
            <th>Name</th>
        </tr>";
while ($query = mysqli_fetch_array($data)) {
            $counter++;
            echo "<tr>
            <th>{$counter}</th>
            <td>{$query["name"]}</td>
            <td><a href='xxx.php?id={$query["id"]}'><i class='ion-edit'></i></a><i class='ion-close-round'></i>
<div class='modal'> //modal have of course display none!
  <div class='mContent'>
    <div class='mHeader'>
      <h2>Modal Header</h2>
    </div>
    <div class='mMiddle'>
      <a href='xxx.php?id={$query['id']}'>delete</a>
    </div>
    <div class='modal-footer'>
      <h3>Modal Footer</h3>
    </div>
  </div>
</div></td></tr>";
}
echo "</table>\n";

J查询:

$('.ion-close-round').on('click', function () {
 $('.modal').css("display", "block");
});

这个脚本当然“打开”每个模态，但我只想打开具有给定 id 的模态

谢谢大家的帮助

Answer 1

您可以使用 $.next() 来定位 .ion-close-round 之后的 .modal

$('.ion-close-round').on('click', function () {
 $(this).next('.modal').css("display", "block");
});