jquery - 标签（链接）在重新排序后被破坏选项卡元素

Question

我正在使用 jquery-ui 选项卡（）。Evertihng 工作得很好。
然后我通过 jquery 对 DOM 中的标签重新排序。

前：

<li id="L1">Tab 1</li>
<li id="L2">Tab 2</li>

后：

<li id="L2">Tab 2</li>
<li id="L1">Tab 1</li>

当我将标签悬停时，它们会显示指向内容 div 的正确链接。但是通过单击选项卡没有任何反应。

任何人都知道我的错是什么？

编辑：我的重新排序 li 元素的代码：

$(document).ready(function() {
  var elems = $('#tabsUl').children('li').remove();

  elems.sort(function(a,b){
    return parseInt($(a).attr("data-order")) > parseInt($(b).attr("data-order"));
  });

  $('#tabsUl').append(elems);
});​

和标记示例：

<ul id="tabsUl">
  <li data-order="4">Item 4</li>
  <li data-order="2">Item 2</li>
  <li data-order="3">Item 3</li>
  <li data-order="1">Item 1</li>
</ul>

Answer 1

使用.detach()而不是.remove().

var elems = $('#tabsUl').children('li').detach();

文档：

.detach()

该.detach()方法与 相同.remove()，除了.detach()保留与已删除元素关联的所有 jQuery 数据。当移除的元素稍后要重新插入到 DOM 中时，此方法很有用。