2012-06-12 34 views
0

在下面的代碼(fiddle):當一個可拖動的元素被丟棄時,甚至會發生什麼?

<div class="connected"> 
    <div class="myDivs">Hello 01</div> 
    <div class="myDivs">Hello 02</div> 
    <div class="myDivs excludeThisCss">Hello 03</div> 
    <div class="myDivs">Hello 04</div> 
    <div class="myDivs">Hello 05</div> 
    <div class="myDivs excludeThisCss">Hello 06</div> 
    <div class="myDivs">Hello 07</div> 
    <div class="myDivs">Hello 08</div> 
    <div class="myDivs excludeThisCss">Hello 09</div> 
    <div class="myDivs">Hello 10</div> 
</div> 

<div class="connected"> 
    <div class="myDivs">Hello 01</div> 
    <div class="myDivs">Hello 02</div> 
    <div class="myDivs excludeThisCss">Hello 03</div> 
    <div class="myDivs">Hello 04</div> 
    <div class="myDivs">Hello 05</div> 
    <div class="myDivs excludeThisCss">Hello 06</div> 
    <div class="myDivs">Hello 07</div> 
    <div class="myDivs">Hello 08</div> 
    <div class="myDivs excludeThisCss">Hello 09</div> 
    <div class="myDivs">Hello 10</div> 
</div> 

JS:

$(function() { 
    $(".connected").sortable({ 
     connectWith : ".connected", 
     items  : ".myDivs:not(.excludeThisCss)" 
    }).disableSelection(); 

});​ 

CSS:

.connected { 
    float: left; 
    margin: 6px; 
} 
.myDivs { 
    margin: 0 5px 5px 5px; 
    padding: 5px; 
    font-size: 1.2em; 
    font-family: sans-serif; 
    width: 120px; 
    background: #F2F2F2; 
    cursor: pointer; 
    border: 1px solid #D9D9D9; 
    color: #1C94C4; 
} 
.excludeThisCss { 
    background: pink; 
} 
​ 
​ 

我試圖當一個項目拖&下降到執行代碼。是否有可拖動的可拖曳事件在可排序時被觸發?

+2

未來,請不要*只是*包括一個鏈接到jsFiddle。您的帖子應該獨立於任何其他資源;想想如果jsFiddle將來會發生什麼事情。 – Matt

+0

@Matt注意,謝謝 –

回答

0

是的,你可以使用stop事件:

stop: function(event, ui) { ... } 

Updated jsfiddle heredocs for the event are here

ui對象包括以下內容:

  • ui.helper - 當前幫手元素(最常見的是該物品的克隆)
  • ui.position - 當前拖動的元素
  • ui.placeholder - - 當前幫手
  • ui.item的絕對位置 - 佔位符(如果你定義一個)
  • ui.sender - 輔助
  • ui.offset的當前位置的排序,其中項目來自(只有當你從一個連接列表移動到另一個時)
相關問題