如何動態創建多個ul列表？

我有一個<ul>「ul-list-one」，其中包含一些複選框。如果選中複選框並單擊移動按鈕，則表示它將移動到另一個<ul>「ul-list-two」，並且選中的複選框將從前一箇中刪除，這裏是「ul-list-one」。如何動態創建多個ul列表？

在「ul-list-two」中，我可以做同樣的事情，並且它移動到下一個，這次是「ul-list-three」。

注意：「ul-list-two」和「ul-li-three」將動態創建。

這裏我已經做了一些工作，但是我怎麼能夠動態創建多個<ul>？

 $('#mer').click(function() { 
     var txtBox = "";  
     var txtstatus = false; 
     $('input[type="checkbox"]').each (function() {    
     var t = $(this); 
     var from = 'checklist'; 
     var val=$("#hidden_id").val(); 
     var to = 'ch'; 
     if (!t.is(':checked')){ 
      var swap = to; 
      to = from; 
      from = swap; 
      } else { 
      txtstatus = true; 
      } 
     $(':checkbox:checked').attr('disabled', true); 
     $('#'+to).append(t.attr('name', to).parent()); 
     $('#ch').addClass('br');   
     }); 
     if(txtstatus){ 
     txtBox = "<input type='text' value=''>"; 
     $('#ch').after(txtBox); 
     } 
     }); 

     //close buttom code 
     $('#cls').click(function() { 
     $('input[type="checkbox"]').each (function() {   
     var t = $(this); 
     var from = 'checklist'; 
     var to = 'ch'; 
     if (t.is(':checked')){ 
      var swap = to; 
      to = from; 
      from = swap; 
      } 
     $(':checkbox:checked').attr('disabled', false); 
     $(':checkbox:checked').attr('checked', false); 
     $('#'+from).append(t.attr('name', from).parent()); 
     }); 
     });

來源

2011-07-08 Mr.T.K

26次瀏覽，0回答。我建議你創建一個[jsfiddle]（http://jsfiddle.net）或一個[jsbin]（http://jsbin.com），以便人們可以玩耍。 –

你會列出什麼樣的模式。給一些'html'結構 – thecodeparadox

爲什麼你需要動態創建第二個和第三個列表？如果你總是隻有3個列表，你可以在運行時創建它們。然後將第一個ul中的所有列表項存儲在數組中，並使用.next（）和.prev（）jQuery方法來回移動它們。 –

不是我寫過的最漂亮的東西。如果你想離開空的ul，只需註釋掉removeEmpties調用。我並不擔心複選框的順序，但複選框移動後，在單獨的函數中實現將很容易。我還假定你不希望他們超出最初的ul。如果你想要這個功能，你可以添加另外一個如果是移動功能。

http://jsfiddle.net/pJgyu/13225/

來源

2011-07-08 22:10:07

如何動態創建多個ul列表？

回答

相關問題