Javascript 引导按钮在表中不工作

我正在创建一个简单的bootstrap ToDo应用程序，其中一些按钮有问题。我在顶部有一个按钮，使用jQuery和PHP添加任务。此按钮按预期工作。添加任务后，下面的表将更新并显示所有任务。在任务的右侧是一个删除按钮，这是给我问题的按钮。以下是该按钮的代码：

HTML

PHP-这就是生成表结果的原因。这不是现场制作，所以请忽略MySQL缺乏安全性；）

我尝试使用

.btn primary

而不是

.btn danger

，结果相同。我注意到，如果我把

标签放在整个桌子上，当我按下按钮时，它会刷新页面，但仍然没有

控制台。log

或

警报

。另外，我认为，由于我使用的是jqueryclick事件，所以我不必在表的周围有

标记

---

如果您能提供任何帮助，我们将不胜感激。

我只用一个按钮就测试了您的代码：一旦我直接使用了alert和console方法调用，就可以让它正常工作，而不需要任何变量（var）。注意，我没有你的PHP代码，但我希望这有帮助

$('.btn-danger').click(function () {
    alert('Hello there!');
    console.log('Hello there!');
    //var alert = alert('Hello there!');
    //var console = console.log('Hello there!'); 
    //return alert, console;
});

---

当动态添加内容时，应该使用事件委派，如下所示

$(document).on('click', '.btn-danger', function(){//...});

---

您似乎正在通过PHP和ajax动态添加按钮。在动态添加内容（如so

$（文档）时，对事件使用委托。在（'click'，'.btn danger'，function（）{/…}）上这正是我需要做的。我将仔细阅读事件授权，并确定何时需要使用它。如果你有任何建议阅读，我肯定会感兴趣。如果没有，不用担心，我会用谷歌搜索。另外，你应该把你的评论作为一个答案，这样我才能判断它是否正确。一旦使用了事件委派，它就按预期工作。谢谢你的帮助！
<?php
    $con = mysqli_connect("localhost","root","root","todo");

    if (mysqli_connect_errno()) {
      echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }
    $searchTasks = "SELECT * FROM tasks WHERE state=1 ORDER BY date DESC";
    $results = mysqli_query($con,$searchTasks);
    $row = '';  
    while($row = mysqli_fetch_array($results)) {
        echo '<tr><td>'.$row['list'].'</td><td><button name="deleteTask" type="submit" class="deleteTask btn btn-danger pull-right" data-id="'.$row['key'].'">Delete</button></td></tr>';
    }
    mysqli_close($con);
?>

$('.btn-danger').click(function () {
    alert('Hello there!');
    console.log('Hello there!');
    //var alert = alert('Hello there!');
    //var console = console.log('Hello there!'); 
    //return alert, console;
});

$(document).on('click', '.btn-danger', function(){//...});