为按钮点击填充单独的 div，其中按钮 ID 基于变量答案

【问题标题】：Populate a separate div for button clicks where button id is based on variables为按钮点击填充单独的 div，其中按钮 ID 基于变量
【发布时间】：2014-12-22 23:53:20
【问题描述】：

我目前有一个用 MySQL 数据填充的表，如下所示：

 $result = mysqli_query($con,"SELECT * FROM artist LIMIT 10");
if (!$result) {
    printf("Error: %s\n", mysqli_error($con));
    exit();
}




      //show artist data in table
       echo "<table><th>BadNoise Artists</th>";
 while($row = mysqli_fetch_array($result))
          {
          echo "<tr><td>" . $row['FirstName'] . "</td><td>" . $row['LastName'] . "</td><td><button id='" . $row['ArtistNumber'] . "'>Songs by this artist</button></tr>" ;
          }
 echo "</table>";
 mysqli_close($con);

标题中的脚本告诉每个按钮单击以填充相同的 div：

<script>
$(document).ready(function(){
  $("button").click(function(){
       var ArtistNumber = $(this).attr('id');
    $("#div1").load("demo_test" + ArtistNumber + ".txt");
  });
});
</script>

我需要做的是在表格的每一行中为每个结果放置一个 div，并让该行的按钮在单击时填充该行的 div

【问题讨论】：

如果你展示了你真正想要的 html 的样子......
我们能再澄清一点吗？你在说什么div？
老实说，我没有必要构建 HTML。我是 PHP/AJAX 的新手，只是想先把功能弄下来。让我确切地告诉你我的简介是什么：“该按钮支持启用 AJAX 的‘onclick’处理程序，该处理程序随后用于向页面添加与歌曲相关的内容。为了支持这一要求，每个条目必须包含一个空的 div 元素。这个 div当用户单击按钮时，会动态填充一组链接，这些链接指向该艺术家提供的歌曲。内容通过 AJAX 回调函数插入到 div 中。

标签： php jquery mysql populate

【解决方案1】：

我想我知道你想做什么。您想要的是在您单击按钮时填充的每一行中的 div。所以你的 PHP 代码应该是这样的：

while($row = mysqli_fetch_array($result))
{
echo "<tr><td>" . $row['FirstName'] . "</td>
<td>" . $row['LastName'] . "</td>
<td><button id='" . $row['ArtistNumber'] . "'>Songs by this artist</button></td>
<td><div id='artist" . $row['ArtistNumber'] . "'></div></td></tr>" ;
}

您可以更改您的 JQuery 以使用其 ID 将其放入 div：

$("#artist" + ArtistNumber).load("demo_test" + ArtistNumber + ".txt");

希望这会有所帮助！

【讨论】：

谢谢你，这行得通！但由于某种原因，每次我单击任何按钮时都会打开一个空白的 javascript 警报...
别担心，已经解决了。再次感谢。
我试过了，但我的声望不够高 :(（我只在这里待了一会儿）对不起！
哦，好吧。无论如何，很高兴能提供帮助。

【解决方案2】：

您需要为表格的每一行添加一个 div。你可以给它一类“结果”。然后在你的 JS 中引用它。这就是我会做的：

HTML/PHP：

<body>
    <?php

      //$result = mysqli_query($con, "SELECT * FROM artist LIMIT 10");
      if (!$result) {
      printf("Error: %s\n", mysqli_error($con));
      exit();
      }

      //show artist data in table
      echo "<table><th>BadNoise Artists</th>";
      while ($row = mysqli_fetch_array($result)) {
          ?>
          <tr>
              <td><?= $row['FirstName']; ?></td>
              <td><?= $row['LastName']; ?></td>
              <td><button id="<?= $row['ArtistNumber']; ?>">Songs by this artist</button></td>
              <td><div class='results'></div></td>
          </tr>
          <?php
      }
      echo "</table>";
      mysqli_close($con);
    ?>
</body>

JS：

<script>
    $(document).ready(function() {
        $("button").click(function() {
            alert();
            var ArtistNumber = $(this).attr('id');
            $(this).closest("tr").find(".results").load("demo_test" + ArtistNumber + ".txt");
        });
    });
</script>

【讨论】：