Question

我尝试了这里找到的解决方案：How do I add a delay in a JavaScript loop?但我无法让它适合我。

    jQuery.fn.createEntry = function () {
        $("#List").append('<span>New Entry</span>');
        $("#List span").draggable({ grid: [30,45] });
    }

    jQuery.fn.tenTimes = function() {
        for (var i = 1; i <= 10; i++){
            $(document).createEntry();
        }
    }

在.createEntry（）脚本中，新对象绑定到我拥有的.draggable（）插件。我正在使用键盘快捷键（keyup）来运行这个tenTimes函数（）。如果我不止一次按键太多，许多新对象将无法拖动。它似乎是随机的，哪些对象无法变得可拖动。我想也许我的快速按键会破坏那些失败的绑定事件，但即使我走得很慢，有些也不会变得可拖动。

在继续使用for循环之前，有什么方法可以检查对象是否正确绑定了吗？是否有更严格的方法？不幸的是，这不是动画，所以我不能使用.delay（）。

解

这是我使用appendTo（）处理元素的第三个脚本，这导致了问题。

使用append（）或appendTo（）似乎保持对象与draggable绑定，但它沿途丢失了它的左/顶css，因此无法拖动它。我只是创建了一个全新的元素，并将相关数据复制过来，然后删除旧的元素，而不是找出一些.css（）黑客（每个值都是唯一的）。 Draggable在某个其他位置正确绑定到它。有了这个，问题就解决了。

Answer 1

修改

尝试.setTimeout（）

我没有读到你说的.Delay（）不能用。

Answer 2

另外，您可以通过替换

来获得轻微的性能优势

jQuery.fn.createEntry = function () {
    $("#List").append('<span>New Entry</span>');
    $("#List span").draggable({ grid: [30,45] });
}

与

jQuery.fn.createEntry = function () {
    $("#List").append($('<span>New Entry</span>').draggable({ grid: [30,45] }));
}

因为您可能不想将draggable重新应用于所有已存在的span。

实际上，这可能是破坏你的代码的原因。第一个span已将draggable重新应用了10次。 draggable是幂等的吗？

添加延迟到For循环

2 个答案: