將一個JavaScript函數應用於可拖動副本

我想應用函數調用copie_contenue，在我拖動原始文件後創建的副本上更改div父代編號，但我的腳本更改了原始副本但我也嘗試過ui.helper在這個地方，但沒有任何事情發生將一個JavaScript函數應用於可拖動副本

$('#model_1').draggable({ 
    connectToSortable:'#global_div', 
    addClasses: false, 
    helper:'clone', 
    stop: function(e,ui) { 
     $(this).replaceWith(copie_contenue("model_1")); 
    } 
    })

來源

2011-04-21 strawberry

恢復我想是下降的助手，但沒有使用.droppable – strawberry 2011-04-21 09:30:54

你只想把它放到排序您連接到，或任何用戶釋放鼠標按鍵？ – DarthJDG 2011-04-21 09:43:38

@DarthJDG只對排序，我連 – strawberry 2011-04-21 09:48:19

要更改新插入的項目，您應該使用sortable的接收事件。然而，截至今天，有在jQuery用戶界面（1.8.11）一個已知的限制/缺少的功能，使你不能很容易地從接收事件訪問克隆項目。現有的ui.item引用原始元素，而不是副本。

作爲解決方法，您可以在拖動開始時向原始項添加特殊類，以便可以在接收事件（在克隆插入DOM後觸發）搜索可排序項。在拖動結束時，您必須確保無論發生什麼，文檔中的任何元素都不應該設置特殊的類。如果你拷貝/克隆這是特別重要的，作爲排序的接收事件觸發可拖動的停止事件之前（這裏我們從原來的可拖動刪除特殊類）。

http://jsfiddle.net/3Gkrf/1/

HTML：

<ul> 
    <li id="test" class="dragme">Test</li> 
</ul> 
<ul class="sortme"> 
    <li>One</li> 
    <li>Two</li> 
    <li>Three</li> 
</ul>

CSS：

.dragme { border:1px solid silver; width:50px; height:50px; } 
.newitem { background-color:yellow; }

的javascript：

$(function(){ 
    $(".sortme").sortable({ 
     receive: function(){ 
      $(this).find(".newitem").each(function(){ 
       $(this).removeClass("newitem"); 

       // Do your stuff with $(this), which is the newly created cloned item 
      }); 
     } 
    }); 

    $(".dragme").draggable({ 
     connectToSortable: ".sortme", 
     helper: "clone", 
     start: function(){ 
      $(this).addClass("newitem"); 
     }, 
     stop: function(){ 
      $(this).removeClass("newitem"); 
     } 
    }); 
});

如果你只是想手動創建另一個實例每當DRA gging停止，這可能是可拖動的停止事件。但是，我認爲在那裏沒有可靠的方法來檢測它是否落在可排序或其他地方。

stop: function(){ 
    var clone = $(this).clone().appendTo("#wherever"); 
    // do anything else with the clone variable here 
}

您必須手動克隆您的對象，因爲即使您設置了助手來克隆它，助手也會在拖動停止時被銷燬。如果它在可排序的情況下丟失，則最終可能會得到兩個新對象，因爲排序會自動克隆接收。

來源

2011-04-21 10:15:31 DarthJDG

我tryed它，但它doesent似乎工作..我的問題是被療法無論如何，我可以做到這一點的形式.draggable不使用.sortable – strawberry 2011-04-21 10:42:01

嗯，這是對的jsfiddle工作，也許問題在別的地方。你使用最新的jQuery和jQuery UI庫嗎？目前沒有其他方法可以知道是否要將它放到可排序的目錄上。沒有可靠的方法從可拖動的事件中檢測它。我在我的回答結尾添加了一些額外的行... – DarthJDG 2011-04-21 13:33:50

@DarthJDG：其實它的工作，但我包括我的感謝

排序在拖動腳本

$(function() { 

      $('.dragging').draggable 
      ({ 
revert: 'invalid', 
connectToSortable:'#global_div', 
addClasses: false, 
helper:'clone', 
drag: function(event,ui) 
{ 

    $('#global_div').sortable 
    ({ 

       receive: function(event, ui) 
    { 
     $(this).find(".dragging").each(function(){ 


      // Do your stuff with $(this), which is the newly created cloned item 
      }: 
    } 
    }); 
}

}）;

來源

2011-04-22 08:28:46 strawberry

將一個JavaScript函數應用於可拖動副本

回答

相關問題