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


Posted in Javascript onSeptember 25, 2019

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

没有下拉效果是这样的

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

经过修改后就解决了:

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

具体原因是没有导入: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导航栏不展示下拉列表的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript算法题 求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Jul 21 Javascript
node.js中的http.response.addTrailers方法使用说明
Dec 14 Javascript
JavaScript实现数组在指定位置插入若干元素的方法
Apr 06 Javascript
jQuery表格插件datatables用法详解
Nov 23 Javascript
JS基于clipBoard.js插件实现剪切、复制、粘贴
May 03 Javascript
JavaScript暂停和继续定时器的实现方法
Jul 18 Javascript
JavaScript实现多栏目切换效果
Dec 12 Javascript
webpack配置sass模块的加载的方法
Jul 30 Javascript
JS div匀速移动动画与变速移动动画代码实例
Mar 26 Javascript
解决layui动态添加的元素click等事件触发不了的问题
Sep 20 Javascript
vue点击自增和求和的实例代码
Nov 06 Javascript
JS class语法糖的深入剖析
Jul 07 Javascript
vue-cli2与vue-cli3在一台电脑共存的实现方法
Sep 25 #Javascript
解决Layui当中的导航条动态添加后渲染失败的问题
Sep 25 #Javascript
layui实现二维码弹窗、并下载到本地的方法
Sep 25 #Javascript
使用localStorage替代cookie做本地存储
Sep 25 #Javascript
JavaScript使用localStorage存储数据
Sep 25 #Javascript
Vue路由守卫之路由独享守卫
Sep 25 #Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 #Javascript
You might like
利用Memcached在php下实现session机制 替换PHP的原生session支持
2010/08/21 PHP
php 生成文字png图片的代码
2011/04/17 PHP
php下获取http状态的实现代码
2014/05/09 PHP
Yii2搭建后台并实现rbac权限控制完整实例教程
2016/04/28 PHP
php学习笔记之mb_strstr的基本使用
2018/02/03 PHP
javascript数字数组去重复项的实现代码
2010/12/30 Javascript
confirm的用法示例用于按钮操作时确定是否执行
2014/06/19 Javascript
分享10个原生JavaScript技巧
2015/04/20 Javascript
理解javascript定时器中的单线程
2016/02/23 Javascript
js实现(全选)多选按钮的方法【附实例】
2016/03/30 Javascript
最棒的Angular2表格控件
2016/08/10 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
2017/06/04 Javascript
JS通过调用微信API实现微信支付功能的方法示例
2017/06/29 Javascript
JS实现数组深拷贝的方法分析
2019/03/06 Javascript
微信小程序云开发 搭建一个管理小程序
2019/05/17 Javascript
解决vue的router组件component在import时不能使用变量问题
2020/07/26 Javascript
[03:57]《不朽》——2015DOTA2国际邀请赛—中国军团出征主题曲MV
2015/07/15 DOTA
[01:09:19]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第二场 2月28日
2021/03/11 DOTA
[50:44]DOTA2-DPC中国联赛 正赛 SAG vs Dragon BO3 第二场 2月22日
2021/03/11 DOTA
python实现批量转换文件编码(批转换编码示例)
2014/01/23 Python
Python面向对象之继承和组合用法实例分析
2018/08/27 Python
Python+Selenium使用Page Object实现页面自动化测试
2019/07/14 Python
opencv 阈值分割的具体使用
2020/07/08 Python
师范生实习的个人自我鉴定
2013/10/20 职场文书
大学生毕业自我评价范文分享
2013/11/07 职场文书
教师专业理论水平的自我评价分享
2013/11/09 职场文书
法制演讲稿
2014/09/10 职场文书
农村党建工作汇报材料
2014/10/27 职场文书
2014年初三班主任工作总结
2014/12/05 职场文书
2014年图书馆个人工作总结
2014/12/18 职场文书
离婚撤诉申请书范本
2015/05/18 职场文书
失恋33天观后感
2015/06/11 职场文书
2015年法律事务部工作总结
2015/07/27 职场文书
详解MySQL连接挂死的原因
2021/05/18 MySQL
Jedis操作Redis实现模拟验证码发送功能
2021/09/25 Redis