JS：导航条图片切换问题
<script type="text/javascript" src="../common/js/jquery.js"></script>
<script type="text/javascript" src="../common/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="../common/js/common.js"></script>
<body class="nav1">
<div id="nav">
<ul class="over">
<li id="nav1"><a href="../function/index.php"><img src="../common/images/nav01_off.gif" width="92" height="75" alt="功能 Function" /></a></li>
<li id="nav2"><a href="../feature/index.php"><img src="../common/images/nav02_off.gif" width="90" height="75" alt="特征 Feature" /></a></li>
<li id="nav3"><a href="../casestudy/index.php"><img src="../common/images/nav03_off.gif" width="150" height="75" alt="导入实例 Track record" /></a></li>
<li id="nav4"><a href="../price/index.php"><img src="../common/images/nav04_off.gif" width="90" height="75" alt="价格 Price" /></a></li>
<li id="nav5"><a href="../introduct/index.php"><img src="../common/images/nav05_off.gif" width="134" height="75" alt="关于导入 Introduction" /></a></li>
<li id="nav6"><a href="../qanda/index.php"><img src="../common/images/nav06_off.gif" width="90" height="75" alt="Q＆A" /></a></li>
</ul>
</div>
</body>
js代码
$(function(){
if( $('body:eq(0)').attr('class').match(/(nav\d)/) ){
$('li#'+RegExp.$1).find('img').attr('src', function(){return this.src.replace('_off','_on')});
}
}
我想通过jquery实现点击导航图片后，切换到点击后的图片。
原来的html可以实现，在我把header，导航条，footer改成独立的文件后，
通过php require_once后，只有第一个始终是on的图片。
以为是class="nav1"的原因，可改成class="nav_top"后，之后的js也不执行了。
不知是何原因。
3 个解决方案
#1
在线等解答。。。。
#2
你include进来后路径是相对这个页面的上一级目录中加载js，如果目录很深路径就出错了
使用绝对路径，从根目录下开始，这样就不用考虑目录所处路径了，链接的也要注意修改
<script type="text/javascript" src=" /common/js/jquery.js"></script>
<script type="text/javascript" src="/common/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="/common/js/common.js"></script>
使用绝对路径，从根目录下开始，这样就不用考虑目录所处路径了，链接的也要注意修改
<script type="text/javascript" src=" /common/js/jquery.js"></script>
<script type="text/javascript" src="/common/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="/common/js/common.js"></script>
#3
不好意思，找到原因了。
原来的header中class="nav1"是根据文件夹变化的，所以我在header中添加了一个动态设置。
原来的header中class="nav1"是根据文件夹变化的，所以我在header中添加了一个动态设置。
注意！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系我们删除。