如何在AJAX调用后使jQuery工作

时间:2012-02-03 00:22:50

标签: ajax jquery-ui jquery

我已经阅读了一些关于此的帖子,但没有人给出 特定的 答案(或者问题不必要地复杂......)。我会保持简单。

我正在使用jQuery UI来实现可拖动/可放置的功能。当在目标元素上放置draggable时,将调用AJAX函数。这一切都很好,但只有一次。当我再次尝试时,我甚至无法拖动元素。这是我的(简化)代码:

$(document).ready(function() {
    $(".item").draggable();
    $(".target").droppable({
        drop: function(){
            AjaxFunction(var1, var2);
        }            
    });
});

这是简化的AjaxFunction:

function AjaxFunction (var1, var2) {
    var url = "ajax/script.php";
    var data = {position: var1, tag: var2};
    $.post(url, data, function(data) {
        $(".target").html(data).show(); 
    });
}

任何人都可以给我一个关于如何使其工作的上述代码的具体解决方案吗?

1 个答案:

答案 0 :(得分:0)

您可能想参考这篇文章:

Jquery Draggable - How do I create a new draggable div on the fly that can then be dragged?

特别是这部分:

$(element).draggable('disable');

$(element).draggable('enable');

它不完全相同,但它提供了一些问题的见解。基本上,你可能想尝试禁用draggable和droppable,然后在你的ajax成功之后重新启用它们。

function AjaxFunction (var1, var2) {
    var url = "ajax/script.php";
    var data = {position: var1, tag: var2};
    $.post(url, data, function(data) {
        $(".item").draggable("destroy");
        $(".target").droppable("destroy");

        $(".target").html(data).show().droppable({revert:true});
        $(".item").draggable();
    });
}