jquery - Jquery wrapInner - 不包括第一个元素

Question

我正在尝试打开/折叠我网站的部分，这些部分是带有图例标签上的单击事件的字段集。但是，我将需要使用 wrapInner 在字段集中添加一个 div 以隐藏内容……但这也隐藏了图例（我绝对不想这样做）:-)。如何使用 wrapInner 但指定不隐藏图例（或者字段集中包含的第一个元素 - 因为它始终是图例）。

$("#mainarea fieldset").wrapInner("<div class='fieldsetWrapper'></div>");

$("#mainarea fieldset:not(:first)").addClass("fsClosed"); // Close all fieldsets within the main area (but not the first one)

$("#mainarea fieldset legend").mousedown(function(){  // When clicking the legend of a fieldset ...
    $("#mainarea fieldset:not(.fsClosed)").addClass("fsClosed");  // If it's already open, close it
    $(this).parent().removeClass("fsClosed");  // If it's closed, remove the closed class from the containing fieldset
    return false;
}); 

干杯马克

Answer 1

为了回应您在 Pim 示例中的评论，您需要遍历字段集

$('#mainarea fieldset').each(function(){
   $(this).children().not('legend').wrapAll("<div class='fieldsetWrapper'></div>");
});

您可能可以将其重构为这样的东西；

$('#mainarea fieldset').each(function(){
   $(':not(legend)', this).wrapAll("<div class='fieldsetWrapper'></div>");
});

Answer 2

$('#mainarea fieldset').children(':gt(0)').wrapAll("<div class='fieldsetWrapper'></div>");

这应该可以解决问题。
关于 wrapAll 函数的信息：http: //docs.jquery.com/Manipulation/wrapAll#html >

编辑
可能更好：

$('#mainarea fieldset').children().not('legend').wrapAll("<div class='fieldsetWrapper'></div>");

Answer 3

我最终使用了以下解决方案：

//Wrap everyting in the fieldset tags
$('#mainarea fieldset').wrapInner("<div class='fieldsetWrapper'></div>");
 
//for each legend tag move it out of the newly created wrapping div 
$('legend').each(function(){
  $(this).insertBefore($(this).parent());
});

首先它将所有内容包装在字段集标签内（包括图例），然后它“解包”图例标签。

Answer 4

$(document).ready(function(){
    $("fieldset legend").click(function(){
        $(this).parent().children().not('legend').toggle("slow");
    });
});