一个菜单,点击各项更改背景,a标签href="#"(后面5个)的可以正常更改,但是href=""(前面5个)的虽然执行了js,但是好像是刷新了一下页面,背景又回到了原来的样子,这个href=""是怎么影响这个非期望的结果的?百思不得其解,真心求教!代码如下:<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>菜单</title> <style> ul{ list-style: none;} .menu{ width: 100%; height: 60px; line-height: 60px; background-color: #1b7271;}.menu li{ display: block; float: left;}.menu li a:hover,.menu li.on a { background-color: #105156;}.menu li a{ display: block; padding:0 15px; text-decoration: none; text-align: center; color: #fff;}</style> </head> <body> <ul class="menu" id="menu"> <li class="on"><a href="">首页</a></li> <li><a href="">二十项人格</a></li> <li><a href="">定力训练</a></li> <li><a href="">作文写作</a></li> <li><a href="">案例分享</a></li> <li><a href="#">国学课程</a></li> <li><a href="#">课程信息</a></li> <li><a href="#">教学参考</a></li> <li><a href="#">导师介绍</a></li> <li><a href="#">关于我们</a></li> </ul></body> <script src="jquery-1.10.2.min.js"></script><script> $(function () { $("#menu").on("click", "li", function () { $("#menu li").removeClass("on"); $(this).addClass("on").siblings().removeClass("on"); });});</script></html>
4 回答
倚天杖
TA贡献1828条经验 获得超3个赞
a href ="" 默认打开的还是当前页面,会刷新一下重新打开。
a href ="#" 浏览器地址栏网址后面会多显示1个#。不会刷新页面,会回到页面顶部
添加回答
举报
0/150
提交
取消