2

、、、の4つのクラスがshowあります。これらの各クラスを変更して、隣のクラスに置き換えたいと思います。言い換えれば、私のjQueryコードは次のようになります...hide1hide2hide3

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

問題は、4つのクラスがすべて、私が望んでいないショークラスを持つことになってしまうことです。showのクラスをhide1に変換したいだけです。hide1をhide2に変換します。これらの4行が一度に1行ではなく、すべて一度に発生するようにコードを作成するにはどうすればよいですか。

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 に答える