返回列表 發帖

請問JQuery的draggable用法

        $(".Place").draggable({
                connectToSortable: '#Sort',
                helper: 'clone',
                revert: 'invalid'
        });
如果用draggable拖曳到一個div到list裡面,我又想從list拖曳出來並取消拖曳的div。

是要再寫一個draggable嗎?

回復 1# test155

嗯,應該是需要。
To infinity and beyond!

TOP

本帖最後由 test155 於 2010-4-29 10:08 編輯

如果我再寫一個draggable功能,原本的功能就會影響到。
那改用droppable不知可不可以寫出來?

還是要再寫一個list存放不要的div,或者在拖曳到另一個list的div上增加移除div?

TOP

這樣講不太清楚,有沒有實際的例子說明呢?
To infinity and beyond!

TOP

本帖最後由 test155 於 2010-4-29 22:16 編輯

我先寫好拖拉功能
$(".Place").draggable({
                connectToSortable: '#Sort',
                helper: 'clone',
                revert: 'invalid'        });
我把div物件托放到list上
ul { 
        list-style-type: none; 
        margin: 0; 
        padding: 0; 
        margin-bottom: 10px;}
我現在想從list上移除這個div物件

如果我再寫一個draggable功能不就是會和上面的功能影響到?

我想在list1拖拉到list2中的div物件,往外框拖拉出去,就有取消div物件的功能。
或者說在list2的div物件中,增加一個移除的按鈕?
<div id=List_1>
        <h2>List_1</h2>
        <ul>
          <div id="L1" class="Place">L1</div>
        </ul>
</div>
            
<div id=List_2>
        <h2>List_2</h2>
        <ul>
          <div id="L2" class="Place2">L2</div>
        </ul>
</div>

TOP

嗯,這樣有比較清楚了,我本來以為你要把 list2 內的項目拖曳回 list1 時,把 list1 的給刪掉...

這樣的話還是可以在拖曳到 list2 後,動態變成為 dragable 物件,讓他可以再被拖曳,至於要拖曳到哪裡算是刪除,就看你的設計囉。
To infinity and beyond!

TOP

我想在list2裡面的div物件,拖拉出去後即可移除。
不知這樣怎寫,還看不太懂ui。

TOP

回復 7# test155

拖曳到 #list2 之後,把新的 li 也建立為 draggable 物件即可拖曳。並設定為拖曳到 body 就刪除。
$("#list1 li").draggable({helper: 'clone',revert: true});
$("#list2").droppable({
    accept: '#list1 li, #list2 li',
    drop: function(ev, ui) {
        if (ui.draggable.parent().attr("id") == "list2") {
            var $a = $(ui.draggable);
        } else {
            var $a = $(ui.draggable).clone();
        }
        $(this).append($a);
        $a.draggable();
    }
});
$('body').droppable({
    accept: '#list2 li',
    drop: function(ev, ui) {
        $a = $(ui.draggable);
        $(this).append($a);
        $a.remove();
    }
});
To infinity and beyond!

TOP

如果在同一個容器拖動、排序,不就會重複clone?
該用containment作判斷嗎?

TOP

嗯,所以我的程式中有一段 if else 就是在做這件事。
至於實做內容就看你的實際需要。
To infinity and beyond!

TOP

返回列表 回復 發帖