Question

我昨天刚刚开始使用jquery / ajax。我尝试了一些事情，但我遇到了一堵墙。

我有一个索引文件，我在这个脚本中包含了我的js脚本我有两个函数（见下文）

在我使用的索引文件中包括一个php文件，其中包含一些包含某些行的表（来自mysql的行）。这包括我在js脚本中用于.load的文件（mod / hoofdmenu.php）。

一个脚本用于通过拖放更改行的顺序，这非常有效。其他脚本用于在单击图像时更改1行（发布/取消发布）。这个脚本也很完美。但是，当我运行此脚本时，第一个脚本（拖放）将继续工作。 “发布/取消发布”脚本仍然有效。

我认为这是因为$（'＃showdata'）。load（'mod / hoofdmenu.php'）; 非常感谢所有建议/帮助。

包含js文件：



$(function() {
    $(".entry").live("click",function(event) {
    event.preventDefault();
    var id = $(this).attr("id");
    var dataString = 'id='+ id ;
    var parent = $(this).parent();
    $.ajax({
            url: "save.php",    
            type: "POST",       
            data: dataString,       
            cache: false,
            success: function (html) {  
                $('#showdata').load('mod/hoofdmenu.php');           
            }       
        });
    });
});
$(function() {
    $(".tbl_repeat tbody").tableDnD({
        onDrop: function(table, row) {
            var orders = $.tableDnD.serialize();
            $.post('mod/order.php', { orders : orders });
        }
    });

});

Answer 1

应用于DOM元素的拖放事件现在已被AJAX请求加载的新内容替换。您需要将tableDnD行为放在新元素上。

可能有一些花哨的livequery风格的方式，但这应该有效：

function initDnD(root) { 
    root.find(".tbl_repeat tbody").tableDnD({
        onDrop: function(table, row) {
            var orders = $.tableDnD.serialize();
            $.post('mod/order.php', { orders : orders });
        }
    });
};

$(function() {
    $(".entry").live("click",function(event) {
        event.preventDefault();
        var id = $(this).attr("id");
        var dataString = 'id='+ id ;
        var parent = $(this).parent();
        $.ajax({
            url: "save.php",    
            type: "POST",       
            data: dataString,       
            cache: false,
            success: function (html) {  
                $('#showdata').load('mod/hoofdmenu.php', function() {
                    initDnD($('#showdata'));
                });           
            }       
        });
    });
    initDnD($("body"));
});

在.load（）之后jquery脚本不起作用

1 个答案: