Question

我知道我需要使用。像.live这样的东西可以使这个工作，但我只是在这里混淆了一个h3ll。

我有一个从数据库中提取的数据列表。每个项目都附有一个表单，用于从数据库中删除该项目。

好的，这里是表单的提交函数：

$(document).delegate('#delete_cat_form','submit', function() {

    var cat = $('#cat-name-imput').val(),
    id  = $('#cat-id-imput').val();

        $.post("ajax.php", {name:cat,id:id,action:'delete_cat'}, function(data){

                //Display a brief message!
                $("#message").fadeIn(3000).html(data);

                $("#message").fadeOut(3000).html(data);

                refreshMenu(); // Refresh Menu                      
            });

    return false;

});

刷新菜单功能如下：

function refreshMenu(){

    $('.menu-million-dollar-wrapper').load('ajax.php', {action:'refreshMenu'}, function(data){

    });

}

函数可以处理文档的初始加载，但只能处理一次。在ajax从ajax.php返回更新查询后，似乎所有事件处理程序都消失了，没有任何东西可以再次运行。

我已经尝试过阅读其他似乎与可能相同的答案，但由于某些原因我无法理解这个概念。

如何查询新内容并显示它，同时不会丢失任何事件处理程序？

这是ajax.php在调用时返回的内容..这是原始的，但我已经确认它确实返回了相同的HTML，但更新的项目越来越少

 <form class="edit-button" method="post" action="'.$_SERVER['PHP_SELF'].'">
    <input type="hidden" name="name" value="'.$row['name'].'"/>
    <input type="hidden" name="id" value="'.$row['id'].'"/>
    <input type="hidden" name="action" value="delete_cat"/>
    <input type="submit" value="Delete"/>
</form>

$_SERVER['PHP_SELF']不正确但不应在此问题中发挥作用。

这与用于最初在加载时显示表单的代码相同。

Answer 1

这是异步执行的：

$("#message").fadeIn(3000).html(data);
$("#message").fadeOut(3000).html(data);

在同一时刻，你正在消失并淡出同样的信息。相反，你应该在fadeIn完成后fadeOut。

参见manula，http://api.jquery.com/fadeIn/，第一个参数是淡化函数完成时的回调。

Answer 2

在jquery中，大多数东西都可以接受回调函数。所以而不是

$("#message").fadeIn(3000).html(data);
$("#message").fadeOut(3000).html(data);

这样做

$("#message").fadeIn(3000, function() {
    $(this).html(data);
    $("#message").fadeOut(3000).html(data);
});

在淡入完成后执行函数内的东西

Answer 3

尝试将所有元素更改为类而不是ID，因为您提到有多个元素。

$(document).on('submit', '.delete_cat_form', function() {
    var self = $(this);

    var cat = self.find('.cat-name-imput').val(),
    id  = self.find('.cat-id-imput').val();

刷新ldiv内容后jQuery无法正常工作

3 个答案: