1

Stackoverflowサイトでは、ユーザーが投票していない場合、最初は投票矢印を「vote-up-off」/「vote-down-off」にすることができます。ユーザーが以前に投票した場合は、上下に移動することもできます。この3つのケースから始めて、ユーザーがクリックすると、クラスを切り替えたいと思います。このサイトの素敵な人々の助けを借りて、私はこれまでにこのコードに到達しました：

if($("a.vote-up-down").hasClass("vote-up-on")){
    $(".vote-up-on").removeClass("vote-up-on").addClass("vote-up-off");
    $(".vote-down-off").removeClass("vote-down-off").addClass("vote-down-on");
}
else if($("a.vote-up-down").hasClass("vote-down-on")){
    $(".vote-down-on").removeClass("vote-down-on").addClass("vote-down-off");
    $(".vote-up-off").removeClass("vote-up-off").addClass("vote-up-on");
}

これは、すでに投票が行われているときに上矢印を再度クリックしない場合、またはすでに投票が行われているときに下矢印を再度クリックしない場合に機能します。それ以外の場合は、実際の投票を無視して切り替えを続けます。最初に両方の矢印がオフの場合、このコードは両方を変更します。私のajax関数では、実際の投票値（1または-1）の応答メッセージを提供できます。上記のコードを修正するにはどうすればよいですか？

4

2 に答える 2

3

別のクラス名として使用vote-up-onしない場合は、全体が簡単になります。vote-down-on1つのクラスを切り替えるだけです：http on：//jsfiddle.net/ghSEb/。

$(".vote").on("click", function() {
    $(".vote").not(this).removeClass("on");  // make sure to remove other vote
    $(this).toggleClass("on");​​​​​​​​​               // switch this one
});
于 2012-08-22T22:59:06.437 に答える
2

.toggleClass（）内の条件を使用します

var $voteDown = $("a.vote-up-down");
$(".vote-up-on").toggleClass('vote-up-off',$voteDown.hasClass("vote-up-off"))
$(".vote-up-off").toggleClass('vote-up-on',$voteDown.hasClass("vote-up-on"))
于 2012-08-22T22:59:56.717 に答える