2010-10-18 53 views
1

我似乎无法使preventDefault()与以下代码一起工作......浏览器仍然希望在点击后跳转到页面的顶部。有想法该怎么解决这个吗?为什么不能阻止默认为jQuery工作?

$('#controls a').click(function(event){ 

event.preventDefault(); 

var r = $(this).attr('rel'); 

var c = $('#container').attr('class'); 
// Prevent redundant actions 
if (r != c) { 
    // Toggle 'active' class to show selection 
    $('#controls a').removeClass('active'); 
    $(this).addClass('active'); 
    // Fade out function then callback to change the view mode 
    $('#container').fadeOut(100, function(){  
    $('#container').removeAttr('class'); 
    $('#container').addClass(r); 
    // Fade the container back in 
    $('#container').fadeIn(100); 
    }); 
} 

}); //end list view 
+1

您可以添加相关的HTML,并确定页面中没有任何JS错误吗? – JAL 2010-10-18 16:37:52

+0

代码的其余部分是否工作? – user113716 2010-10-18 16:40:41

+0

你点击后是否在你的URL中附加了'#'(或其他...)?如果没有,preventDefault正常工作... – Shog9 2010-10-18 16:42:34

回答

2

问题(可能,这部分是猜测)不preventDefault(),但事实YOUT页有总高度含量少了一会儿(13毫秒是精确的),改变动画等等它淡出,但没有得到display: none;一帧,这样的:

$('#container').animate({ opacity: 0 }, 100, function(){  
    $('#container').removeAttr('class'); 
    $('#container').addClass(r); 
    // Fade the container back in 
    $('#container').animate({ opacity: 1 }, 100); 
}); 

这样,你的#container0高度了一会儿,致使页后退向上滚动仅仅是因为网页有整体更短。

+0

噢射击我怎么错过那个你是正确的只是增加了最小高度来测试这个理论,它的工作你钉了它,谢谢 – Terry 2010-10-18 16:55:06

+0

@Terry - 上述解决方案是否解决它? – 2010-10-18 16:58:22

+0

是的,只是更新它,并确实工作 – Terry 2010-10-18 17:04:50