[英]Jquery wrap elements inside div
I want to add a div on the three following elements: 我想在以下三个元素上添加一个div:
<div class="wrapper">
<fieldset class="inner"></fieldset>
<fieldset class="inner first_name"></fieldset>
<fieldset class="inner last_name"></fieldset>
<fieldset class="inner user"></fieldset>
<fieldset class="inner password"></fieldset>
<fieldset class="inner"></fieldset>
<fieldset class="inner avatar"></fieldset>
<fieldset class="inner submit"></fieldset>
</div>
So the results are as follows: 因此结果如下:
<div class="wrapper">
<div class="inner-left">
<fieldset class="inner"></fieldset>
<fieldset class="inner first_name"></fieldset>
<fieldset class="inner last_name"></fieldset>
<fieldset class="inner user"></fieldset>
<fieldset class="inner password"></fieldset>
</div>
<div class="inner-middle">
<fieldset class="inner"></fieldset>
<fieldset class="inner avatar"></fieldset>
</div>
<div class="inner-right">
<fieldset class="inner submit"></fieldset>
</div>
</div>
I've tried Jquery Multiple Wrap, but I can not implement it. 我已经尝试过Jquery Multiple Wrap,但是我无法实现它。 can it be done with jQuery?
可以用jQuery完成吗?
Thank you, 谢谢,
Use .wrapAll()
in jquery. 在jquery中使用
.wrapAll()
。 And .slice()
split the dom elements what you want 然后
.slice()
将dom元素拆分为您想要的
$(".inner").slice(0,5).wrapAll( "<div class='inner-left'></div>" );
$(".inner").slice(5,7).wrapAll( "<div class='inner-middle'></div>" );
$(".inner").slice(7).wrapAll( "<div class='inner-right'></div>" );
var cache = $( ".inner" )
cache.slice(0,5).wrapAll( "<div class='inner-left'></div>" )
.end()
.slice(5,7).wrapAll( "<div class='inner-middle'></div>" )
.end()
.slice(7).wrapAll( "<div class='inner-right'></div>" );
You can use :lt
and :gt
pseudo selectors to get a range of elements, then wrapAll
to put them in an element: 您可以使用
:lt
和:gt
伪选择器来获取一系列元素,然后将wrapAll
放入元素中:
$('.inner:lt(5)').wrapAll($('<div>').addClass('inner-left'));
$('.inner:gt(4):lt(2)').wrapAll($('<div>').addClass('inner-middle'));
$('.inner:gt(6)').wrapAll($('<div>').addClass('inner-right'));
Demo: http://jsfiddle.net/7JY8p/1/ 演示: http : //jsfiddle.net/7JY8p/1/
Try this 尝试这个
$('.inner:eq(0), .inner:eq(1), .inner:eq(2), .inner:eq(3), .inner:eq(4)').wrapAll( "<div class='inner-left'></div>");
$('.inner:eq(5), .inner:eq(6)').wrapAll( "<div class='inner-middle'></div>");
$('.inner:eq(7)').wrap( "<div class='inner-right'></div>");
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.