jquery开关点击类图片更改

时间:2012-07-27 15:11:28

标签: c# javascript jquery asp.net

<tab>
<div class="switchLeft"></div>


.switchLeft
{

}

.switchRight
{

}



js code

 $("div.switchLeft").click(function () {

          if (className == "switchRight") {
            $(this).removeClass("switchRight");
            $(this).addClass("switchLeft");

        }

        else if (className == "switchLeft") {
            $(this).removeClass("switchRight");
            $(this).addClass("switchRight");
            break;

        }

    });

但是如果在此之后,交换机再次工作并且switchRight移除  谢谢

3 个答案:

答案 0 :(得分:2)

你有

 $(this).removeClass("switchRight");
 $(this).addClass("switchRight");

我怀疑你想要

 $(this).removeClass("switchLeft");
 $(this).addClass("switchRight");

否则你只是添加和删除相同的类。

答案 1 :(得分:0)

要访问课程,您可以使用this.className,也可以$(this).attr('class')

if($(this).attr('class') == "switchRight") {

    $(this).removeClass("switchRight");
    $(this).addClass("switchLeft");

}

else if ($(this).attr('class') == "switchLeft") {
    $(this).removeClass("switchLeft");
    $(this).addClass("switchRight");
    break;

}

使用this.className

if(this.className == "switchRight") {

    $(this).removeClass("switchRight");
    $(this).addClass("switchLeft");

}

else if (this.className == "switchLeft") {
    $(this).removeClass("switchLeft");
    $(this).addClass("switchRight");
    break;

}

答案 2 :(得分:0)

尝试

$("div").click(function () {
    $(this).toggleClass("switchLeft switchRight");
});

http://jsfiddle.net/S4WG3/

注意:您的代码每次都没有切换的原因之一是您的原始选择器。 $("div.switchLeft")只会将divswitchLeft课一起提升,因此divswitchRight将永远不会切换回来。