作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一些带有 div 的 div,我想循环遍历这些 div,同时从当前的类中删除一个类,然后将一个类添加到下一个类中。
然后,当我到达最后一个时,我想回到起点并重新开始。
我已经有一种方法可以做到这一点,但它只适用于一组 div,我将有许多组 div 需要独立循环。
下面是几个集合的示例(每个集合中有随机数量的 div):
<div class="set">
<div class="current">Item1</div>
<div>Item2</div>
<div>Item3</div>
</div>
<div class="set">
<div class="current">Item1</div>
<div>Item2</div>
<div>Item3</div>
<div>Item4</div>
<div>Item5</div>
</div>
我需要删除当前类,并将其添加到每组中的下一个 div,依此类推。
这是我可以使用一组的代码:
$(function() {
var items = $('.set div').length;
current = 0;
setInterval(function() {
$('.set div').eq(current).removeClass('current');
if (current == items - 1){
current = 0;
} else {
current++;
}
$('.set div').eq(current).addClass('current');
}, 500);
});
最佳答案
我的看法:
$('.set').each(function(){
(function($set){
setInterval(function(){
var $cur = $set.find('.current').removeClass('current');
var $next = $cur.next().length?$cur.next():$set.children().eq(0);
$next.addClass('current');
},1000);
})($(this));
});
<小时/>
版本 2:
setInterval(function(){
$('.set').each(function(){
var $cur = $(this).find('.current').removeClass('current');
var $next = $cur.next().length?$cur.next():$(this).children().eq(0);
$next.addClass('current');
});
},1000);
关于jQuery 无限循环遍历每个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10949086/
我是一名优秀的程序员,十分优秀!