帮我改变我的jquery代码添加额外的div
问题描述:
我有一个幻灯片,它唯一改变的照片。我需要在每张照片的顶部添加一个新的div框。目前jQuery代码只需#slideshow和.active。如何修改它以抓取新的div类“.newbox”(第一张照片为.newbox1,第二张为.newbox2等)。每次在不同的照片上出现不同的盒子。这是我的照片幻灯片jQuery代码:帮我改变我的jquery代码添加额外的div
function slideSwitch() {
var $active = $('#slideshow DIV.active');
if ($active.length == 0) $active = $('#slideshow DIV:last');
// use this to pull the divs in the order they appear in the markup
var $next = $active.next().length ? $active.next()
: $('#slideshow DIV:first');
// uncomment below to pull the divs randomly
// var $sibs = $active.siblings();
// var rndNum = Math.floor(Math.random() * $sibs.length);
// var $next = $($sibs[ rndNum ]);
$active.addClass('last-active');
$next.css({opacity: 0.0})
.addClass('active')
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass('active last-active');
});
}
$(function() {
setInterval("slideSwitch()", 5000);
});
</script>
我的HTML:
div id="slideshow">
<div class="active">
<a href="http://www.mylink.com/" target="_blank"><img src="http://route/img.jpg" alt="alt" /></a>
<div class="newbox"></div>
</div>
答
您应该使用jquerys wrap方法
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
jQuery代码包
$('.inner').wrap('<div class="new" />');
成为
<div class="container">
<div class="new">
<div class="inner">Hello</div>
</div>
<div class="new">
<div class="inner">Goodbye</div>
</div>
</div>
在你的情况,我假定这将是
$("img"). wrap('<div class="new" />');