jquery拖放功能

时间:2010-12-28 13:12:41

标签: jquery-ui

此函数接受一个li元素并将其添加到另一个ul元素。触发此代码后,附加到li元素的子跨度的jquery事件在第一次单击时不会触发。

function AddToDropBox(obj) {
    $(obj).children(".handle").animate({ width: "20px" }).children("strong").fadeOut();
    $(obj).children("span:not(.track,.play,.handle,:has(.btn-edit))").fadeOut('fast');
    $(obj).children(".play").css("margin-right", "8px");
    $(obj).css({ "opacity": "0.0", "width": "284px" }).animate({ opacity: "1.0" });
    if ($(".sidebar-drop-box ul").children(".admin-song").length > 0) {
        $(".dropTitle").fadeOut("fast");
        $(".sidebar-drop-box ul.admin-song-list").css("min-height", "0");
    }
    if (typeof SetLinks == 'function') {
        SetLinks();
    }
    if(document.getElementById("ctl00_cphBody_hfRemoveMedia").value===""||document.getElementById("ctl00_cphBody_hfRemoveMedia").value===null)
    {
        document.getElementById("ctl00_cphBody_hfRemoveMedia").value=(obj).attr("mediaid");
    }
    else
    {
        var localMediaIDs=document.getElementById("ctl00_cphBody_hfRemoveMedia").value;
        localMediaIDs=    localMediaIDs.replace((obj).attr("mediaid"),"");
        document.getElementById("ctl00_cphBody_hfRemoveMedia").value=localMediaIDs+", "+(obj).attr("mediaid");
    }
}

此代码中是否缺少导致该问题的内容?

更新

这正是我用于实际调用addtoDropbox方法()的jquery可排序功能。

// Make our dropbox a selectable & sortable.  
    $(".sidebar-drop-box ul").sortable({  
        connectWith: '.admin-left',  
        tolerance: "intersect",  
        handle: ".handle",  
        opacity: "0.5",  
        receive: function(event, ui) {  
            **AddToDropBox(ui.item)**;  
        },  
        start: function(event, ui) {  
            $(".sidebar-drop-box ul.admin-song-list").css("min-height", "70px");  
            isDraggingSong = true;  
            //soundManager.stopAll();  
            //$(".btn-stop").removeClass("btn-stop");  
        },  
        stop: function(event, ui) {  
            if ($(".sidebar-drop-box ul").children("li").length == 0) {  
                $(".dropTitle").fadeIn();  
            }  
        }  
    }); //.selectable({ filter: 'li', cancel: '.btn-stop,.btn-play,.notes,.btn-del,span.remove' });  

    // Do the same for our playlist.  
    $(".admin-left").sortable({  
        opacity: '0.5',  
        tolerance: "intersect",  
        handle: ".handle",  
        appendTo: 'appentToHolder',  
        items: "li.admin-song",  
        update: function(event, ui) {  
            $(ui.item).css("opacity", "0.0").animate({ opacity: "1.0" }, "medium");  
            if ($.browser.msie && $.browser.version == "7.0") {  
                $(ui.item).css("margin-bottom", "-6px");  
            }  
        },  
        receive: function(event, ui) {  
            AddToLeftList(ui.item);  
        },  
        start: function(event, ui) {  
            $(".admin-left li.ui-selected").removeClass("ui-selected");  
            isDraggingSong = true;  
            //soundManager.stopAll();  
            //$(".btn-stop").removeClass("btn-stop");  
        },  
        stop: function(event, ui) {  
            CheckLeftList();  

        },  
        connectWith: '.sidebar-drop-box ul'  
    }).selectable({ filter: 'li.admin-song', cancel: '.head *,.btn-stop,.btn-play,.notes,.btn-del,span.remove' }); // added .head * to fix bug# 1013  

粗线调用我之前添加的函数,它放置li元素。

我不确定断开连接的确切位置,但我知道在这两个代码段之间它会破坏某些内容并且下一次单击对源ul不起作用。多年来我一直在努力奋斗。我无法将这个形状转回给我的老板......哈哈

感谢名单

1 个答案:

答案 0 :(得分:0)

看起来这个函数不会向列表中添加内容。

  • 此功能首先执行一些操作 CSS更改为obj和它 后人。
  • 然后它去调用全局 功能SetLinks(如果是 定义的)。
  • 第三,它设定了价值 元素
    “ctl00_cphBody_hfRemoveMedia”,其中 可能是某种投入。

看起来这是至少从其他两个功能粘贴在一起,需要重构。

我猜测丢失事件的原因可能是在调用AddToDropBox附近。