jQuery UI可拖动不'；使用ajax内容刷新时不会注入

基本上我用一些可拖动的元素设置了一个页面，效果很好

我刚刚添加了一个ajax内容刷新，每10秒刷新一次div，元素在其中

执行此操作后，可拖动功能不再工作

我认为这是因为正在刷新的元素位于单独的页面上，然后使用ajax加载到索引中

我如何解决这个问题

多谢各位

---

基本HTML（此处无特殊内容）

Notes.php 出于所有目的，本文只包含一个带有class=“postbit”的div

希望对您有所帮助

将所有事件绑定器放在一个函数中，然后调用该函数：

function wrapper(){
 $('.postit').draggable(
 {
 start: function(){
    $(this).css("z-index", a++);
 },
 stop: function(){
    var offset = $(this).offset();
    var xPos = offset.left;
    var yPos = offset.top;
 var pid = $(this).attr('id');
 var datastring = 'xpos=' + xPos + ' ypos=' + yPos + ' id=' + pid;

 $.ajax({
    type: "POST",
    url: "savepositions.php",
    datatype: "text",
        data: {positions: datastring}
 });
 }
});

$('.postit').click(function(){
 $(this).addClass('top').removeClass('bottom');
 $(this).siblings().removeClass('top').addClass('bottom');
 $(this).css("z-index", a++);
});
}

然后：

然后在ajax成功函数调用中：

complete: function() {
    wrapper();
    $('#loading').hide();
    $('#notes').show();
},

---

我知道你想做什么，但由于某种原因它不起作用。我所有的jquery代码都已经在文档就绪标记中了。但即使如此，我也无法让它正常工作。@OliverEvans在document.ready之外创建包装函数，然后在您的document.ready内调用该函数。ready和ajax回调应该可以工作。很抱歉，这似乎也不起作用。我已经做了一个例子，我是否正确地实现了您的代码|scripts.php:|index.php:| notes.php:很抱歉使用了粘贴箱。能否尝试在$（'#notes'）.show（）之后调用包装器？这可能是个很小的问题。对不起，这也不行。我刚刚将脚本标记复制到ajax添加的页面中。（notes.php），这在一定程度上是可行的。元素变得可以拖动，但是因为我技术上把所有东西都调用了两次，所以所有东西都会闪烁，而且不可接受。

function wrapper(){
 $('.postit').draggable(
 {
 start: function(){
    $(this).css("z-index", a++);
 },
 stop: function(){
    var offset = $(this).offset();
    var xPos = offset.left;
    var yPos = offset.top;
 var pid = $(this).attr('id');
 var datastring = 'xpos=' + xPos + ' ypos=' + yPos + ' id=' + pid;

 $.ajax({
    type: "POST",
    url: "savepositions.php",
    datatype: "text",
        data: {positions: datastring}
 });
 }
});

$('.postit').click(function(){
 $(this).addClass('top').removeClass('bottom');
 $(this).siblings().removeClass('top').addClass('bottom');
 $(this).css("z-index", a++);
});
}

$(function(){
   wrapper(); // This does the binding on page load
});

complete: function() {
    wrapper();
    $('#loading').hide();
    $('#notes').show();
},