<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> new document </title> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="stylesheet" type="text/css" href="" /> <style type="text/css"> .box{width:800px;border:1px solid red;height:600px;margin:0 auto;} .zc{float:left;margin-right:50px;} ul {list-style:none;} a{text-decoration:none;} .box_nei{height:40px;line-height:40px;border-bottom:8px solid #E5E5E5;} .box_nei li a:hover{ border-bottom:8px solid #C30D23;font-size:18px; color:#666666 ; } .box_nei li a.hover{ font-size:18px; color:#666666 ; border-bottom:8px solid #C30D23;} .box_nei li a{ font-size:18px; color:#666666; width:124px; height:40px; line-height:40px; display:block;} .help_now{border-bottom:6px solid #C30D23;} </style> <script type="text/javascript"> $(function(){ var id = $('#id').val(); $('#'+id).addClass('help_now').siblings().removeClass("help_now"); }); </script> </head> <!--要求默认显示一个红色底框;点击另一个这个消失另一个显现红色底框--> <body> <div class="box"> <div class="box_nei"> <ul> <li class="zc"> <a id="zc" href="#"> 注册指南 </a> </li> <li class="zc" > <a id="ass" href="#">新手必读</a> </li> <li class="zc" > <a id="sf" href="#">收费标准</a> </li> <li class="zc" > <a id="cj" href="#">常见问题 </a> </li> </ul> </div> <div> </body> </html>
1、少引用jquery
2、没有注册点击动作对应的方法
$(function(){ $(".zc").click(function(){ $(this).addClass('help_now').siblings().removeClass("help_now"); }); });
怎么让它默认显示第一个有底边框呢
@yangzailu: 额
直接写进去 <li class="zc help_now"> <a id="zc" href="#"> 注册指南 </a> </li>
或者 写js里也行
$(function(){ $(".zc").eq(0).addClass('help_now'); $(".zc").click(function(){ $(this).addClass('help_now').siblings().removeClass("help_now"); }); });
没太明白你要干嘛
你没有引用jquery啊!
已经引用了 怎么让它默认显示第一个有地边框呢
有运行的截图么
你到底说的是啥意思,没弄明白