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>

（不，我不能改变HTML :-(）

我可以将字段集包装没问题，

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

但似乎无法看到如何将fieldset元素移动到<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>');

如何通过使用jQuery将字段集包装在列表项中来使字段集可排序

2 个答案: