JQuery对class属性的操作实现按钮开关效果

.controlOff{ 
display:inline-block; 
width:130px; 
height:36px; 
cursor:pointer; 
background-image:url("../iclass/images/teach_off.png"); 
background-repeat: no-repeat; 
} 

.controlOn{ 
display:inline-block; 
width:130px; 
height:36px; 
cursor:pointer; 
background-image:url("../iclass/images/teach_on.png"); 
background-repeat: no-repeat; 
} 
 
再定义一个超链接标签： 
 代码如下:

<a href='javascript:void(0)' id='teachControl' class='controlOff'></a> 
 
接着写JS脚本完成切换效果： 
 代码如下:

function switchTeachControl(){ 
var target = $("#teachControl"); 
if(target.hasClass("controlOff")){ 
target.removeClass("controlOff"); 
target.addClass("controlOn"); 

}else{ 
target.removeClass("controlOn"); 
target.addClass("controlOff"); 

} 
}