Jquery wrapInner - исключая первый элемент
Я пытаюсь открыть / свернуть разделы моего сайта, которые представляют собой наборы полей с событием click в теге легенды. Однако мне нужно использовать 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;
});
Ура Марк
4 ответа
В ответ на ваши комментарии в примере 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>");
});
$('#mainarea fieldset').children(':gt(0)').wrapAll("<div class='fieldsetWrapper'></div>");
Это должно сделать свое дело.
Информация о функции wrapAll: http://docs.jquery.com/Manipulation/wrapAll>
редактировать
возможно даже лучше:
$('#mainarea fieldset').children().not('legend').wrapAll("<div class='fieldsetWrapper'></div>");
В итоге я использовал следующее решение:
//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());
});
Сначала он оборачивает все внутри тегов fieldset (включая легенду), затем "разворачивает" теги легенды.
$(document).ready(function(){
$("fieldset legend").click(function(){
$(this).parent().children().not('legend').toggle("slow");
});
});