Jquery 加载（）使内容在加载后不可单击

我有一个页面，其中有一个div。该div中的内容由一个includes页面填充，该includes页面正在调用数据库以检索内容

当用户单击“添加任务”按钮时，会发出一个ajax调用，将内容插入数据库，并使用.load（）刷新显示所有任务的div。“删除任务”也会发生相同的过程；执行另一个ajax调用，从adatabase中删除一行，并使用.load（）刷新div

我在数据库表中看到了插入和删除，但是前端有点不稳定。当页面首次加载时，我可以执行无限数量的“添加”操作，所有新任务都显示在div中。但是，我只能执行一个“删除”操作；第一次尝试之后，我似乎无法从div中选择元素

以下是“添加”代码：

$("#accept_new_task").click(function(){
    jQuery.ajaxSetup({async: false});

    //Make ajax call
    $.post("[url]", { [data] },

        //If successful, add a new item to task list and clear input
        function(data) {

            //Clear input
            $("#new_task_name").val('');
            $("#new_task_description").val('');

            //Show new task
            $('#newly_added_tasks').load('[page on server]', function() {
            });             



        });

    jQuery.ajaxSetup({async: true});    
});

以及“删除”代码：

//Deletes recently added task
$(".newtask").click(function(){
    alert('!');  //to test
    var val = $(this).attr('value');

    jQuery.ajaxSetup({async: false});

    //Make ajax call
    $.post("[url]", { [data] },

        //If successful, refresh div 
        function(data) {
            $('#newly_added_tasks').load('[page on server]', function() {
                alert('Load was performed.');
            });                             
        });     

    jQuery.ajaxSetup({async: true});  

});

正在加载的内容是使用从数据库调用提取的内容生成的表。下面是一个片段：

<td>'.$task[$i]['name'].'</td>
<td>'.$task[$i]['description'].'</td>
<td><input type="button" class="newtask" name="accept_new_task" id="task_'.$task[$i]['task_id'].'" value="'.$task[$i]['task_id'].'"></td>

。$task[$i]['name'].'
“.$task[$i]['description']”

---

任何帮助都将不胜感激。

jQuery.click事件不是实时事件，因此它只会使分配给它的项目可单击。一旦这些项目被刷新、删除或新项目进入，刷新的项目将不会有单击事件，新项目也不会有单击事件

您需要使用事件，它是.live事件的替代品。这样，当内容刷新时，仍然会附加一个单击事件

---

另一个选项是在内容刷新时分配click事件。

jQuery。click事件不是活动事件，因此它只会使分配给它的项目可单击。一旦这些项目被刷新、删除或新项目进入，刷新的项目将不会有单击事件，新项目也不会有单击事件

您需要使用事件，它是.live事件的替代品。这样，当内容刷新时，仍然会附加一个单击事件

另一个选项是在内容刷新时分配click事件。

更改此行

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

到

或者使用委托

$(document).delegate("click",".newtask",function(){

原因是动态添加的元素不会附加到事件处理程序，如果您使用的是jQuery 1.7+或者使用，请更改此行

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

到

或者使用委托

$(document).delegate("click",".newtask",function(){

原因是动态添加的元素不会附加到事件处理程序。如果您使用的是jQuery 1.7+或者使用它，那么它将与此一起工作

$(document).on("click",".newtask",function(){

或

它将与此配合使用

$(document).on("click",".newtask",function(){

或

---

确保在元素加载到页面后分配或重新分配事件处理程序确保在元素加载到页面后分配或重新分配事件处理程序