jQuery UI可排序：在拖動之前和之後獲取第一個項目

Question

我的web應用程序有一個功能，用戶可以在其中創建最多五個項目的列表。當創建列表時，我們會自動將其命名爲第一個項目，但用戶也可以輸入自定義名稱。所以，你有這樣的事情：

Name: [ Item 1 ] (this is a text box) 

- Item 1 
- Item 2 
- Item 3 
- Item 4 
- Item 5 

我還設置了jQuery用戶界面的交互sortable以便用戶可以單擊並拖動重新排列列表中的項目。現在，我想要做的是在用戶完成拖動後第一個項目被自動重命名，但是只有在他們沒有輸入自定義名稱（可以通過比較名稱和原始的第一個項目，看看他們是否匹配）。

我知道sortable提供了許多可用於運行自定義功能的事件（如start和stop）。問題是我需要在拖動發生之前和之後運行函數以進行比較，但是（據我所知）我無法在它們之間傳遞數據 - 無法使用在start中定義的變量在stop。那麼我怎麼寫這個？

Answer 1

我通過保存的第一個項目在一個全局變量上start，然後使用該來比較當前標題上stop解決了這個。也許不是最好的方式做到這一點，但它的工作：

var saveFirstItem = function(first_item) { 
    startFirstItem = first_item; 
}; 

$(document).ready(function(){ 
    $("#list").sortable({ 
     start: function(event, ui){ 
      var first_item = $("#list li:first-child").text(); 
      saveFirstItem(first_item); 
     }, 
     stop: function(event, ui){  
      var first_item = $("#list li:first-child").text();  
      var current_title = $("#title").val(); 

      if (current_title == startFirstItem){ 
       $("#title").val(first_item); 
      } 
     } 
    }); 
}); 

Answer 2

可能不是最學術的答案，但這裏是一個想法：

爲什麼你需要啓動事件？如果我理解正確，那麼你似乎關心的是將該列表的第一項放在該字段中，但只有當該名稱不是手寫的。 你可能需要一個開始事件，如果你使這個droppable，添加第一個項目刪除名單的名字，但我想你已經有這個？

var nameIsCustom=false; 
$("#ul").sortable(
{ 
    stop: function(event,ui) 
    { 
     nameIsCustom = true; 
     $("ul > li").each(function() 
     { 
      if($("#name").val() == $(this).text()) 
      {nameIsCustom = false;} 
     }); 
     if(!nameIsCustom) 
     { 
      $("#name").val($("#ul > li:first").text()); 
     } 
    } 
});