jQuery appendTo() 在 IE7 中未触发

Question

我正在准备文档上移动一些内容。将其想象为一个精美的选项卡导航，其中列表导航中有一些动态内容，可以在不同的面板之间切换。

我确实可以控制标记，但 ul 位于 CMS 中的不同模板中，与用于插入动态内容的模板不同，因此我基本上是在文档上移动内容，准备将其放在我想要的位置。它工作得很好，除了在 IE7 中，移动永远不会发生。

HTML:

<ul class="pnlHandler"></ul>

<div id="Panels">
   <li>Here goes the content that I want to move</li>
   <div class="pnlFront">
      This has more content, but it's already where I want it
   </div>
</div>

JS:

$(document).ready(function(){
   $("#Panels").children("li").appendTo(".pnlHandler");
});

Answer 1

IE 讨厌 <li>位于 <ul> 之外。您需要将其放在 <ul> 内让它在 IE 中工作。

<ul class="pnlHandler"></ul>

<div id="panels">
   <ul class="dummy">
     <li>Here goes the content that I want to move</li>
   </ul>
   <div class="pnlFront">
      This has more content, but it's already where I want it
   </div>
</div>

然后在你的 JavaScript 中:

$(document).ready(function(){
   $("ul.dummy", "#panels").children("li").appendTo(".pnlHandler");
   $("ul.dummy", "#panels").remove();
});