Question

我正在使用jquery模板动态创建具有不同项目的列表（列）（它们也是动态添加的），还创建了一个插件，可以帮助将项目从一个列表移动到第二个或第三个，即使用jquery ui drag＆amp; ;删除，但在将项目放入新添加的列表时出现问题。

场景：当我点击添加列表按钮时，它会在页面上创建列表。所以我添加了一个名为'list1'的列表，每个列表都有一个按钮来添加列表中的项目，所以按两次我就在'list1'上添加了2个项目。物品可移动/可拖动/可丢弃。现在添加了一个名为'list2'的第二个列表。因此，如果我尝试将项目从“list1”移动到“list2”，则不会执行此操作，而是将项目移动到“list1”。这是在没有页面重新加载的情况下发生的，但是如果我刷新页面并立即执行相同的操作，则可以将项目移动到“list2”。以下是我用于拖放目的的代码（以下代码放在我的jquery插件中）：

var id = $('.' + options.dropID);
            var id0 = options.dropID;

            $('.' + options.dropID).sortable({

                helper: "clone",
                revert: "invalid", // go back to original droppable when drop outside drop area
                connectWith: '.' + options.dropID,
                over: function (event, ui) {

                    // may be usefull
                    var sortableElement = this;

                    var dataToSave = {
                        name: ui.item.text(),
                        objid: ui.item.attr('title'), // id has changed for array so use original id stored in title
                        thisID: $(sortableElement).attr('id'),
                        array: $(sortableElement).sortable("serialize")
                    };

                    // save the new data
                    saveData(dataToSave);
                }
            });

所以我注意到了一种不同行为的行为： - 添加了一个项目，没有页面加载，它添加了以下div

<div id="337" class="cardItem droppable">         </div>

所以，如果我尝试在此处添加项目，则不允许我这样做。

页面加载后，将上面的div修改为：

它为类属性添加了ui-sortable。所以我尝试搜索添加ui-sortable的方式或时间，这是通过jquery的可排序方法完成的。

并在页面加载时我正在调用这个插件：

    <script type="text/javascript">
        $(window).bind("load", function () {
            $('.laneList').ListDragandDrop();
        });
    </script>

我在添加新列表或项目之后也调用了ListDragandDrop（），但它没有将ui-sortable添加到div中，我必须刷新页面以便它可以使'list2'可丢弃。你能告诉我我做错了什么，或者我应该修改什么才能让它发挥作用。

Answer 1

JQuery sortables似乎已在最新版本中修复，用于创建后添加的项目。如果你仍然看到这个问题，请添加一个jsfiddle，以便我们可以帮助调试。

发出将新项目移动到新添加的列表，直到我进行页面刷新

1 个答案: