老师，帮忙看下
来源：3-6 改写站点导航中的下拉菜单
qq_勿忘初心_H
2020-05-07 22:32:53
这里鼠标放上去之后报错，不知道为什么了，chrome浏览器下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>1</title>
<link rel="stylesheet" href="css/base.css" />
<link rel="stylesheet" href="css/index.css" />
<link rel="stylesheet" href="css/common.css" />
</head>
<body>
<div class="nav-site">
<div class="container">
<ul class="fl">
<li class="fl"><a href="javascript:;" id="nav-site-signin" class="nav-site-login">亲，请登录</a></li>
<li class="fl"><a href="javascript:;" id="nav-site-signup" class="nav-site-signup link">免费注册</a></li>
<li class="fl"><a href="###" target="_blank" class="nav-site-mobile link">手机逛慕淘</a></li>
</ul>
<ul class="fr">
<li class="menu dropdown fl" data-active="menu">
<a href="###" target="_blank" class="dropdown-toggle link transition">我的慕淘<i class="dropdown-arrow icon transition"></i></a>
<ul class="dropdown-layer">
<li><a href="###" target="_blank" class="menu-item">已买到的宝贝</a></li>
<li><a href="###" target="_blank" class="menu-item">我的足迹</a></li>
</ul>
</li>
<li class="menu dropdown fl" data-active="menu">
<a href="###" target="_blank" class="dropdown-toggle link transition">我的收藏<i class="dropdown-arrow icon transition"></i></a>
<ul class="dropdown-layer">
<li><a href="###" target="_blank" class="menu-item">收藏的宝贝</a></li>
<li><a href="###" target="_blank" class="menu-item">收藏的店铺</a></li>
</ul>
</li>
<li class="dropdown fl" >
<a href="###" target="_blank" class="nav-site-category link">商品分类</a>
</li>
<li class="menu dropdown fl" data-active="menu" data-load="js/dropdown-seller.json">
<a href="###" target="_blank" class="dropdown-toggle link transition">卖家中心<i class="dropdown-arrow icon transition"></i></a>
<ul class="dropdown-layer dropdown-left">
<li class="dropdown-loading"></li>
<!-- <li class="dropdown-loading"></li>
<li><a href="###" target="_blank" class="menu-item">免费开店</a></li>
<li><a href="###" target="_blank" class="menu-item">已卖出的宝贝</a></li>
<li><a href="###" target="_blank" class="menu-item">出售中的宝贝</a></li>
<li><a href="###" target="_blank" class="menu-item">卖家服务市场</a></li>
<li><a href="###" target="_blank" class="menu-item">卖家培训中心</a></li>
<li><a href="###" target="_blank" class="menu-item">体验中心</a></li> -->
</ul>
</li>
<li class="menu dropdown fl" data-active="menu">
<a href="###" target="_blank" class="dropdown-toggle link transition">联系客服<i class="dropdown-arrow icon transition"></i></a>
<ul class="dropdown-layer dropdown-right">
<li><a href="###" target="_blank" class="menu-item">消费者客服</a></li>
<li><a href="###" target="_blank" class="menu-item">卖家客服</a></li>
</ul>
</li>
</ul>
</div>
</div>
<script src="js/jquery.js"></script>
<script type="text/javascript" src="js/transition.js"></script>
<script type="text/javascript" src="js/showHide.js"></script>
<script src="js/index.js"></script>
<script type="text/javascript">
(function($){
$('.dropdown').on('dropdown-show',function(e){
var $this=$(this),
dataLoad=$this.data('load');
if (!dataLoad) return;
if (!$this.data('loaded')) { //第一次进来时是undefined，会执行下面代码
var $layer=$(this).find('.dropdown-layer');
html='';
// $layer.html('<li class="dropdown-loading"></li>'); //这里直接写到页面上去
$.getJSON(dataLoad,function(data){
for (var i = 0; i < data.length; i++) {
html +='<li><a href='+data[i].url+' target="_blank" class="menu-item">'+data[i].name+'</a></li>';
}
$layer.html(html);
$this.data('loaded',true);
});
}
})
$('.dropdown').dropdown({
css3:true,
js:false,
animation:'slideUpDown'
});
})(jQuery)
</script>
</body>
</html>写回答
1回答
-
好帮手慕粉
2020-05-08
同学你好，老师是把同学的js代码放到了index.js文件中，又引入了dropdown.js文件进行的测试：
是没有问题的：
同学可以再重新测试一下，注意文件的引入顺序不能变，因为彼此有依赖关系。
祝学习愉快~
0
相似问题