Question

我相信我的代码中出现了循环闭包问题。我看过this article 这是一个很大的帮助。最近我提出了类似于文章中引用的“循环关闭”一节的问题。我已经尝试过他们的解决方案，但它仍然无法解决我的问题。我一直在寻找解决方案，但我总能找到文章中的那个。

我正在使用jqueryui使一些lis可拖动，当我将它们放入容器时，我需要使用特定于该li的变量（节点）。问题是节点（和索引）总是最后一个（因此闭包问题）。

这是我的代码（我已经简化了一点，以便更容易识别问题）：

function makeDraggable(node, i) {
        $("#rightTab li#" + node.id).draggable({
            containment: 'div#container',
            stack: 'div#container',
            scroll: false,
            revert: 'invalid',
            helper: function() {
                return $(this).children().clone();
            },
            start: function(event, ui) {
                $(this).children().css('opacity', 0);
            },
            stop: function(event, ui) {
                $(this).children().css('opacity', 1);
            }
        });

        $("#vis").droppable({
            drop: test(node, i)
        });
    }

    function test(noder, index) {
        return function(event, ui) {
            alert(index);
            //stuff with node.
        }
    }

    function appendInfo(nodes) {
        for(var i = 0; i < nodes.length; i++) {
            $("#rightTab #content ul").append("<li id=" + nodes[i].id + "><div></div></li>");

            if(visualization.hasImageLabel) {
                interfaceHandler.handleImageLabel(nodes[i]);
            }
            if(visualization.hasTextLabel) {
                interfaceHandler.handleTextLabel(nodes[i]);
            }

            makeDraggable(nodes[i], i);
        }
    }

当我提醒索引时（在功能测试中）它总是打印9（最大数组长度），节点也总是最后一个。

（抱歉英语不好）

Answer 1

你在循环的每次迭代中调用$("#vis").droppable({...})。这会设置10个drop事件处理程序;只有最后一个被触发，它被传递（node_nine，9）作为它的参数。

检查回调中ui.draggable的值;它会告诉你丢弃的元素是什么。

Answer 2

问题是$("#vis").droppable(...)取代了之前定义的任何可放置功能，因此不能用闭包。

如果知道索引很重要，那么尝试让每个可拖动节点通过.data(...)了解自己的索引，并在$("#vis").droppable(...)中调用appendInfo()一次，而不是{{1} }}

makeDraggable()

如果没有必要知道索引，那么您只需访问可拖动的function appendInfo(nodes) { for(var i = 0; i < nodes.length; i++) { $("#rightTab #content ul").append("<li id=" + nodes[i].id + "><div></div></li>"); if(visualization.hasImageLabel) { interfaceHandler.handleImageLabel(nodes[i]); } if(visualization.hasTextLabel) { interfaceHandler.handleTextLabel(nodes[i]); } makeDraggable(nodes[i], i); $(node).data('index', i); //<<< node is now aware of its own index } $("#vis").droppable({ drop: function(event, ui) { alert(ui.draggable.data('index'));//I think??? //stuff with node. } }); }，而无需设置或获取ui.draggable。

关闭循环：不工作？（使用jquery）

2 个答案:

关闭循环：不工作？ （使用jquery）

2 个答案:

关闭循环：不工作？（使用jquery）