jqueryui拖放问题

我正在从jQueryUI开发一个带有jquery和拖放功能的工具栏插件。想法如下：我有一个列表（ul）和项目（li），其中每个项目都代表一个工具，如文本、几何图形等。当我拖动一个工具，然后将其放到上下文中时，必须创建一个“小部件”。问题是，将工具放置在容器上后，通过拖放无法再使用该工具。拖放功能只工作一次

希望你能帮助我。对不起我的英语

这是密码

插件

    (function($){

//Attach this new method to jQuery
$.fn.extend({ 

    //This is where you write your plugin's name
    spkToolbar: function(options) {

        //Set the default values, use comma to separate the settings, example:
        var defaults = {
            isDraggable:false
            ,droppableDiv:undefined
        };

        var options =  $.extend(defaults, options);
        //Iterate over the current set of matched elements
        return this.each(function() {
            var o = options;
            $(this).addClass('toolbar');
            if(o.isDraggable)
                $('.toolbar').draggable();
            $(this).addClass('spkToolbar');

            var obj = $(this);              

            //Get all LI in the UL
            var items = $("ul li", obj);
            items.draggable({ appendTo: "body",helper: 'clone' });
            if(o.droppableDiv!=undefined){
                $(o.droppableDiv).droppable({
                    drop: function( event, ui ) {
                        // some extra code for proper widget creation
                    }
                });
            }
        });
    }
});
})(jQuery);

html

<div id="toolbar">
    <ul>
        <li id="save" title="Guardar cambios"><img src="<c:url value="images/toolbar/save.png" />" /></li>
    </ul>
</div>

我几乎忘记了，我使用jQuery1.5和jQueryUI1.8.1

提前感谢

您应该找到可拖动的对象

或者更好的是，使用该选项

---

为什么不部分淡出单击的图标，克隆它，并在克隆的元素上启动拖放操作？

以下是代码的工作版本：

我添加了以下HTML：

<div id="new-dropcontainer">
    <ul>
    </ul>
</div>

---

以防万一，我已经将jquery的版本从1.5改为1.4.1，它成功了。我不知道为什么

---

多亏了所有的

我遇到了拖放项目的定位问题。当我尝试拖放项目而不是添加项目时，它总是位于顶部。这是我为此获得的解决方案。希望对您有所帮助

$(".zone1, .zone2").sortable({
            connectWith: ".test",
            cursor: 'pointer',
            over: function (event, ui) {
                        ui.placeholder.appendTo(ui.placeholder.parent());
                }
            }
        }).disableSelection();

---

你好是的，我在这里做了：var items=$（“ul li”，obj）；draggable（{appendTo:'body'，helper:'clone'}）；是的，很抱歉我在工具栏上看到了

draggable（）

，而不是另一个LOL。。。无论如何，请查看购物车演示，了解他们是如何“丢弃”物品的：

<div id="new-dropcontainer">
    <ul>
    </ul>
</div>

        if(o.droppableDiv!=undefined){
            $(o.droppableDiv).droppable({
                drop: function( event, ui ) {
                    // clone the original draggable, not the ui.helper
                    // and append it to the ul element inside new-dropcontainer
                    jQuery('#new-dropcontainer ul').append(ui.draggable.clone());
                    // some extra code for proper widget creation
                }
            });
        }

$(".zone1, .zone2").sortable({
            connectWith: ".test",
            cursor: 'pointer',
            over: function (event, ui) {
                        ui.placeholder.appendTo(ui.placeholder.parent());
                }
            }
        }).disableSelection();