日期:2014-05-16  浏览次数:20762 次

小白问个简单的html+js问题
刚接触JQ,请问下我在做一个导航点击事件的时候(点击那个菜单就会变色,点其他的原来那个就会变回原来的),为什么不加链接的时候就可以实现,但是添加了就会失效只会出现闪一下的情况。
代码
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery 点击变色</title>
</head>
<style type="text/css">
#t1,#t2,#t3,#t4{
height:30px;
width:50px;
background-color:#33FFFF;
float:left;
margin-left:50px;
text-align:center;
}
.active{background-color:#FC5A0A!important;}
</style>

<script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script>
<script type="text/javascript">
jQuery(function(){
var list = jQuery('#t1, #t2, #t3, #t4');
list.click(function(){
list.removeClass('active');
jQuery(this).addClass('active');

});
});
</script>
<body>
<div id="t1"><a href="">点击</a></div>
<div id="t2"><a href="">点击</a></div>
<div id="t3"><a href="#">点击</a></div>
<div id="t4"><a href="#">点击</a></div>
</body>
</html>

------解决方案--------------------
你可以通过地址栏传参的方式 比如 href='page1.html?tab=1',然后根据tab值来判断选中哪个标签,然后加上选中样式即可