Javascript 表不会异步刷新AJAX、JQuery和PHP

我正在尝试使用Ajax、PHP和Jquery向现有表中添加新行。 Ajax调用成功（通过放置警报进行测试）。但只有在刷新整个页面时，它才会显示新行。我希望在不刷新整个页面的情况下将行添加到表中，但只需动态刷新表即可

示例：当我按下表上的“添加”按钮时，它应该会动态地向表中添加新行

hotTopics\u focusreas\u data.php文件：

<?php
$SQL = "select * from hottopics order by id desc limit 1";


while($row = mysql_fetch_array($SQL,MYSQL_ASSOC)) {
            echo 
          "<tr>
            <td id=title:".$row['id']." contenteditable='true'>".$row['title']."</td>


            <td id=status:".$row['id']." contenteditable='true'>".$row['status']."</td>

            <td><button type='button' class='btn btn-danger'>Delete</button></td>
            </tr>";

    }
?>

表定义：

      <table class="table" id="hottopics_table">
        <thead>
          <tr>
            <th>Title</th>
            <th>Status</th>
            <th></th>
          </tr>
        </thead>
        <tbody>

      <?php    

  $SQL = "select * from hottopics;";
  $result_update = mysql_query($SQL) or die("Couldn't execute query.".mysql_error());
    while($row = mysql_fetch_array($result_update,MYSQL_ASSOC)) {

          echo 
          "<tr>
            <td id=title:".$row['id']." contenteditable='true'>".$row['title']."</td>


            <td id=status:".$row['id']." contenteditable='true'>".$row['status']."</td>

            <td><button type='button' class='btn btn-danger'>Delete</button></td>
            </tr>";
        }

        ?>

        </tbody>
      </table>

标题
地位
检查这个jQuery脚本并检查它是否正常工作。
我认为问题可能就这么简单<代码>$（“#热门话题_表体”）。追加（数据）您确认ajax正在返回您想要的行，对吗？如果ajax调用成功，唯一重要的是它的处理方式。您可以省去所有PHP，只需给我们1）处理响应以添加行的函数和2）该函数的确切输入（AJAX请求的结果）。所有这些PHP代码都没有帮助，应该删除，除非错误在那里。提示：大多数浏览器都包含开发人员工具（F12），允许您调试JavaScript或至少查看错误消息。GET请求从缓存中提取。您应该附加到tbody
$（“#hottopics\u table tbody”）。附加（数据）
请注意，它们不再维护，并且会被删除。而是学习，并使用或。这将帮助你做出决定。
      <table class="table" id="hottopics_table">
        <thead>
          <tr>
            <th>Title</th>
            <th>Status</th>
            <th></th>
          </tr>
        </thead>
        <tbody>

      <?php    

  $SQL = "select * from hottopics;";
  $result_update = mysql_query($SQL) or die("Couldn't execute query.".mysql_error());
    while($row = mysql_fetch_array($result_update,MYSQL_ASSOC)) {

          echo 
          "<tr>
            <td id=title:".$row['id']." contenteditable='true'>".$row['title']."</td>


            <td id=status:".$row['id']." contenteditable='true'>".$row['status']."</td>

            <td><button type='button' class='btn btn-danger'>Delete</button></td>
            </tr>";
        }

        ?>

        </tbody>
      </table>

  $(document).ready(function() {

    $("#hotadd_clicked").click(function(e) {

            endpoint = 'hotTopics_focusAreas_data.php?role=add';

        $.ajax({
            url : endpoint,
            type : "GET",
            async : true,
            success : function(data) {

                $("#hottopics_table tbody").append(data);

            }
        });


        });

    });