如何控制class 的选择
网站的首页 导航文件 里面有2个class classA classB
当打开时候 第一个按钮是 classA 其它的几个按钮都是classB
当打开第二个按钮连接的时候 第二个按钮是classA 其它的都是 classB
请问如何来控制呢 ？
例如
http://www.360buy.com/index.asp 京东商城 上面 那个导航那个东西一样！
请教了！
[解决办法]
那你是服务端的语言撒
比如JSP
<... if(..) class="classA" else class="classB" end ...>
<... if(..) class="classA" else class="classB" end ...>
<... if(..) class="classA" else class="classB" end ...>
<... if(..) class="classA" else class="classB" end ...>
每一个链接都这么写，不久搞定了撒。
[解决办法]
js
[解决办法]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""></HEAD><style type="text/css"> <!-- body { margin:0; padding:0; font: bold 11px/1.5em Verdana; } img { border: none; } /*- Menu Tabs 1--------------------------- */#tabs1 { float:left; width:100%; background:#F4F7FB; font-size:93%; line-height:normal; border-bottom:1px solid #BCD2E6;} #tabs1 ul { margin:0; padding:10px 10px 0 50px; list-style:none;} #tabs1 li { display:inline; margin:0; padding:0; } #tabs1 a { float:left; background:url("tableft1.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs1 a span { float:left; display:block; background:url("tabright1.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#627EB7; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs1 a span { float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#627EB7; } #tabs1 a:hover { background-position:0% -42px; } #tabs1 a:hover span { background-position:100% -42px; } #tabs1 #current a { background-position:0% -42px; } #tabs1 #current a span { background-position:100% -42px; } --> </style> <BODY><div id="tabs1"> <ul> <li id="current"><a href="#" onClick="selectCurrent(this);"><span>Home</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>Products</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>Services</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>Support</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>Order</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>News</span></a></li> <li><a href="#" onClick="selectCurrent(this);"><span>About</span></a></li> </ul></div></BODY></HTML><script>var previous=document.getElementById("current");function selectCurrent(obj){ previous.setAttribute("id",""); previous=obj.parentNode; previous.setAttribute("id","current");}</script>
[解决办法]
Front Controller设计模式
建议lz看一遍有关这个设计模式的文档，要比看别人的JSP好
http://www.techscore.com/tech/J2EEPattern/img/frontcontroller1.gif
http://www.google.cn/search?hl=zh-CN&q=front+controller&btnG=Google+%E6%90%9C%E7%B4%A2&meta=&aq=f
[解决办法]
to :深蓝忧郁
有区别的，我也看出您的代码不是楼主所要的代码，您的代码效果是对的，但那是在本页的情况
a href="#"你的a并没有链到别的页面去，楼主应该是要到别的页面时tab有不同的当前选择,又能很好的
重用代码
不过看了您的代码，有所收获，通过去掉id的方法，有趣，或许能在其他地方派上用场，学习了