关于layui导航栏不展示下拉列表的解决方法

所属分类: 网络编程 / JavaScript 阅读数: 210
收藏 0 赞 0 分享

在使用导航栏时下拉列表不展示

没有下拉效果是这样的

经过修改后就解决了:

具体原因是没有导入:layui/layui.js

我的jsp代码是这样的:

<html>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 
<meta http-equiv="Cache-Control" content="no-siteapp" />
 
<link rel="shortcut icon" href="/favicon.ico" rel="external nofollow" type="image/x-icon" />
<link rel="stylesheet" href="/ssm/static/css/font.css" rel="external nofollow" >
<link rel="stylesheet" href="/ssm/static/css/xadmin.css" rel="external nofollow" >
<link rel="stylesheet" href="/ssm/static/lib/layui/css/layui.css" rel="external nofollow" />
<script type="text/javascript" src="/ssm/jquery/jquery-1.4.4.min.js"></script>
<script src="/ssm/static/lib/layui/layui.all.js" charset="utf-8"></script>
<script src="/ssm/static/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/ssm/static/js/xadmin.js"></script>
 
<head>
<title>Title</title>
</head>
<script>
//注意:导航 依赖 element 模块,否则无法进行功能性操作
layui.use('element', function(){
var element = layui.element;
 
});
</script>
<body>
<ul class="layui-nav">
<li class="layui-nav-item">
<a href="">控制台<span class=" rel="external nofollow" layui-badge">9</span></a>
</li>
<li class="layui-nav-item">
<a href="">个人中心<span class=" rel="external nofollow" layui-badge-dot"></span></a>
</li>
<li class="layui-nav-item">
<a href=""><img src=" rel="external nofollow" //t.cn/RCzsdCq" class="layui-nav-img">我</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >修改信息</a></dd>
<dd><a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >安全管理</a></dd>
<dd><a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >退了</a></dd>
</dl>
</li>
</ul>
</body>
</html>

以上这篇关于layui导航栏不展示下拉列表的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

更多精彩内容其他人还在看

jquery实现可拖拽弹出层特效

这篇文章主要介绍了jquery实现可拖拽弹出层特效,代码非常精简,效果非常棒,这里推荐给有需要的小伙伴
收藏 0 赞 0 分享

浅谈 javascript 事件处理

本文向大家简单介绍了javascript的事件处理机制,从事件源,事件操作到事件处理程序都做了简单介绍,并给出了部分示例,这里推荐给大家。
收藏 0 赞 0 分享

jQuery中:reset选择器用法实例

这篇文章主要介绍了jQuery中:reset选择器用法,实例分析了:reset选择器的功能、定义及匹配重置按钮的使用技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

原生javascript实现隔行换色

这篇文章主要介绍了原生javascript实现隔行换色,需要的朋友可以参考下
收藏 0 赞 0 分享

jQuery中:button选择器用法实例

这篇文章主要介绍了jQuery中:button选择器用法,实例分析了:button选择器的功能、定义及选取按钮的使用技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

jQuery中:file选择器用法实例

这篇文章主要介绍了jQuery中:file选择器用法,实例分析了:file选择器的功能、定义及选取类型为file的<input>元素的使用技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

jQuery中:enabled选择器用法实例

这篇文章主要介绍了jQuery中:enabled选择器用法,实例分析了:enabled选择器的功能、定义及选取所有可用元素的使用技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

AngularJS中取消对HTML片段转义的方法例子

这篇文章主要介绍了AngularJS中取消对HTML片段转义的方法例子,在一些需要显示HTML的地方,就要取消AngularJS的转义,本文就介绍了这种方法,需要的朋友可以参考下
收藏 0 赞 0 分享

jQuery中:disabled选择器用法实例

这篇文章主要介绍了jQuery中:disabled选择器用法,实例分析了:disabled选择器功能、定义及选取所有禁用的表单元素的技巧,需要的朋友可以参考下
收藏 0 赞 0 分享

jQuery中:checked选择器用法实例

这篇文章主要介绍了jQuery中:checked选择器用法,实例分析了:checked选择器的功能、定义及选取选中的复选框或单选按钮时的使用技巧,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多