jQuery hasClass check on altered DOM
I'm having trouble with the jQuery functi开发者_开发技巧on 'hasClass'. It returns false while it should return true. The hasClass function is looking for an class which was added by javascript. So maybe the hasClass function can't find classes in altered HTML? If so, how can I fix it the best way?
$(".slides").mouseover(function(){
$(this).stop(true, true).animate({"width": "+=30px", "height": "+=30px", "margin-top": "+=15px"}, 200);
})
$(".slides").mouseout(function(){
alert($(this).hasClass('activeSlide'));
if(!$(this).hasClass('activeSlide')){
$(this).stop(true, true).animate({"width": "-=30px", "height": "-=30px", "margin-top": "-=15px"}, 200);
}
});
$("body").click(function(){
$(".activeSlide").removeClass("activeSlide");
});
$(".slides").click(function(){
$(".activeSlide").removeClass("activeSlide");
$(this).addClass("activeSlide");
alert("Set");
});
Because of event propagation you your body click handler is always removing the activeSlide class.
try event.stopPropagation();
$(".slides").click(function(event){
$(".activeSlide").removeClass("activeSlide");
$(this).addClass("activeSlide");
event.stopPropagation();
alert("Set");
});
or
$(".slides").click(function(){
$(".activeSlide").removeClass("activeSlide");
$(this).addClass("activeSlide");
alert("Set");
return false;
});
精彩评论