如何制作具有不同功能的可拖动div?

时间:2011-06-10 14:40:06

标签: jquery-ui jquery-plugins drag-and-drop draggable jquery-ui-droppable

我有四个可拖动的div。还有一个div,我放弃了笨拙的div。我的代码基本上只是我下载的一个API,并修改了一些jQuery的网站。

我的问题是所有div在被删除时都具有相同的功能。如何为单个div创建单独的函数?

看起来像这样:

$(function() {
$("#draggable").draggable({ revert: "invalid" });
$("#draggable2").draggable({ revert: "invalid" });
$("#draggable3").draggable({ revert: "invalid" });
$("#draggable4").draggable({ revert: "invalid" });

$("#droppable").droppable({
    activeClass: "ui-state-hover",
    hoverClass: "ui-state-active",
    drop: function(event, ui) {
        if (document.getElementById('draggable')){
            window.location.replace("http://www.example.com");      
            }
        if (document.getElementById('draggable2')){
            window.location.replace("http://www.example2.com");     
            }
        if (document.getElementById('draggable3')){
            window.location.replace("http://www.example3.com");     
            }
        if (document.getElementById('draggable4')){
            window.location.replace("http://www.example4.com");     
            }
        }
    });
});

此代码没有运气。有什么想法吗?

提前致谢!

问候,VG

1 个答案:

答案 0 :(得分:0)

在“if”语句中,您需要执行以下操作:

if(ui.draggable.attr('id') === 'draggable')
{
    // do stuff
}