請問JQuery的draggable用法

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

1^# 跳轉到 » 倒序看帖

打印

字體大小: tT

發表於 2010-4-28 10:19 | 顯示全部帖子

請問JQuery的draggable用法

        $(".Place").draggable({
                connectToSortable: '#Sort',
                helper: 'clone',
                revert: 'invalid'
        });

如果用draggable拖曳到一個div到list裡面，我又想從list拖曳出來並取消拖曳的div。

是要再寫一個draggable嗎?

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

2^#

發表於 2010-4-29 08:59 | 顯示全部帖子

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

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

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

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

3^#

發表於 2010-4-29 22:00 | 顯示全部帖子

本帖最後由 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>

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

4^#

發表於 2010-4-30 17:49 | 顯示全部帖子

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

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

5^#

發表於 2010-5-1 10:17 | 顯示全部帖子

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

Rank: 1

帖子: 25
主題: 4
精華: 0
積分: 7
威望: 4
金錢: 1

6^#

發表於 2010-5-1 23:14 | 顯示全部帖子

本帖最後由 test155 於 2010-5-2 00:56 編輯

$("list2").sortable({revert: true});
                        
$("list1 .Place").draggable({
        connectToSortable: 'list2',
        helper: 'clone',
        revert: 'invalid',
        scroll: false});

我加了排序功能後，變成只要在list2進行排序，就會多clone一個div物件