2

我有四个班级show,,,hide1hide2hide3我想更改这些类中的每一个并将其替换为它旁边的类。换句话说,我的 jQuery 代码看起来像这样......

$(".show").removeClass("show").addClass("hide1");
$(".hide1").removeClass("hide1").addClass("hide2");
$(".hide2").removeClass("hide2").addClass("hide3");
$(".hide3").removeClass("hide3").addClass("show");

问题是这四个班级最终都有我不想要的表演班。我只希望 show 类转换为 hide1,hide1 转换为 hide2 等。我如何编写代码以使这四行同时发生,而不是一次发生一行?

4

5 回答 5

2

只需先选择每个组,然后更改:

// read
var $show = $('.show');
var $hide1 = $('.hide1');
var $hide2 = $('.hide2');
var $hide3 = $('.hide3');

// write
$show.removeClass('show').addClass('hide1');
$hide1.removeClass('hide1').addClass('hide2');
$hide2.removeClass('hide2').addClass('hide3');
$hide3.removeClass('hide3').addClass('show');
于 2012-11-21T23:52:57.050 回答
1

这样做,

function circulateClass(c){
    var i, cl=[];
    for(i=0;i<c.length;i++)
        cl[c[i]]=$("."+c[i]);

    for(i=0;i<c.length;i++)
        cl[c[i]].removeClass(c[i]).addClass(c[(i+1)%c.length]));
}

circulateClass(["show","hide1", "hide2", "hide3"]);
于 2012-11-21T23:54:10.230 回答
1

如果您将类保存在这样的数组中:

var classes = ['show','hide1','hide2','hide3'];

你可以做这样的花哨的事情:

$('.'+classes.join(',.')).attr('class', function(i) {
   return classes[i+1] || classes[0];
});​

演示:http: //jsfiddle.net/7DuEV/

于 2012-11-22T00:04:36.373 回答
0

换个顺序就行了...

$(".show").removeClass("show").addClass("hide1");
$(".hide3").removeClass("hide3").addClass("show");
$(".hide2").removeClass("hide2").addClass("hide3");

对于最后一个,按类名过滤:

$(".hide1").filter(function(){
    return !$(this).hasClass('show');
}).removeClass("hide1").addClass("hide2");
于 2012-11-21T23:54:03.400 回答
0

jsBin 演示

c = 0; // zero based index n (set initial one)

var $el = $( '#parent' ).find( 'div' );
$el.hide().eq( c ).show();

$( '#button' ).click( function() {
   $el.hide().eq( ++c % $el.length ).show(); 
});  
于 2012-11-22T00:04:42.520 回答