div上的jQuery AJAX在另一个div上的jQuery AJAX之后不起作用

Question

我有一个2 divs的页面。每个div必须在加载时调用ajax函数。 但是，当我打开其中一个div后，另一个div的ajax将不起作用。

* #div_remove允许用户从系统中删除用户，并通过ajax在#div_remove中的另一个div中显示现有用户。

#div_logs显示系统中完成的所有事务，并通过ajax将它们显示在#div_logs另一个div上。*

这是jQuery代码：

$("#remove_admin").on("click",function(){
        $("#light").fadeIn("slow");
        $("#div_remove").slideDown("slow");
        showtable();
        event.preventDefault();

        $("#btnRemove").click(function(){
            var text = $.ajax ({
                type: "GET",
                url: "delUserProcess.php?keyword="+$("#txtRemove").val()+"&table=users&field=username",
                async: false,
            }).responseText;
            alert(text);
            showtable();
            event.preventDefault();
        });

    });

    //VIEW USER LOGS
    $("#logs").on("click",function(){
        $("#light").fadeIn("slow");
        $("#div_logs").slideDown("slow");
        showLogs(); 
        event.preventDefault();
    });

    $("#txtUser").on("keyup",function(){
        showLogs(); 
        event.preventDefault();
    });

    $(".date").on("change",function(){
        showLogs(); 
        event.preventDefault();
    });

});

function showtable(){
    $.ajaxSetup ({  
    cache: false  
}); 
    $.ajax({
        type: "GET",
        url: "showAdmin.php",
        async: false,
        success:function(text){
            $("#tblUsers").html(text);
        }
    });

}

function showLogs(){
    $.ajaxSetup ({  
    cache: false  
}); 
    var cBy = $("#txtUser").val();
    var sDate = $("#startDate").val();
    var eDate = $("#endDate").val();


    $.ajax({
        type: "GET",
        url: "showLogs.php?sDate="+sDate+"&eDate="+eDate+"&createdBy="+cBy,
        async: false,
        success: function(text){
            $("#tblHistory").html(text);
        }
    });

}`

所使用的原代码.click() .keyup()和.change() ..我使用已经尝试过.live()和.on()但它仍然没有工作。 请帮忙。

Answer 1

您需要将事件绑定到showLogs文件下。 因为无论何时调用delete或其他事件，它都会用更新的html替换html。 以及事件的存在。 因此，您需要在showLogs文件中调用它们。