如何使字段集可以通過使用jQuery將它們包裝在列表項中進行排序

Question

我在表單中有一組fieldset元素。我需要讓他們排序。大多數插件是基於排序列表的想法 - 所以我試圖把一組

<fieldset> 
    <input type="text" value="1" id="item_0_sort_1" name="item[0][sort]"> 
</fieldset> 
<fieldset> 
    <input type="text" value="1" id="item_0_sort_2" name="item[0][sort]"> 
</fieldset> 
<fieldset> 
    <input type="text" value="1" id="item_0_sort_3" name="item[0][sort]"> 
</fieldset> 

到

<ul> 
    <li> 
    <fieldset> 
     <input type = "text" value="1" id="item_0_sort_1" name="item[0][sort]"> 
    </fieldset> 
    </li> 
    <li> 
    <fieldset> 
     <input type = "text" value="2" id="item_0_sort_2" name="item[0][sort]"> 
    </fieldset> 
    </li> 
    <li> 
    <fieldset> 
     <input type = "text" value="3" id="item_0_sort_3" name="item[0][sort]"> 
    </fieldset> 
    </li> 
</ul> 

（不，這是我可以」 t更改HTML :-(）

我可以包裝的fieldsets沒有問題，

$('form').children('fieldset').wrap('<li>'); 

，但似乎無法看到如何可以移動FIEL dset元素變成<ul>？現在我正在計劃使用jquery.dragsort來移動項目，並讓jQuery相應地對input.val()重新編號 - 任何有關回調的建議都將不勝感激。

還是我正確的做法呢？如果有一種方法可以直接對字段集進行排序，那我猜可能會更好。

Answer 1

使用wrapAll：

$('form li').wrapAll("<ul/>"); 

Answer 2

我準備了DEMO。

這裏的標記：

<form> 
    <fieldset> 
     <input type="text" value="1" id="item_0_sort_1" name="item[0][sort]"> 
    </fieldset> 
    <fieldset> 
     <input type="text" value="1" id="item_0_sort_2" name="item[0][sort]"> 
    </fieldset> 
    <fieldset> 
     <input type="text" value="1" id="item_0_sort_3" name="item[0][sort]"> 
    </fieldset> 
</form> 

和jQuery的：

$('form >*').wrap('<li>'); 
$('form li').wrapAll('<ul>');