关于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 相关文章推荐
jquery1.4后 jqDrag 拖动 不可用
Feb 06 Javascript
img onload事件绑定各浏览器均可执行
Dec 19 Javascript
php与js的区别是什么
Aug 05 Javascript
JQuery 在线引用及测试引用是否成功
Jun 24 Javascript
jQuery Mobile操作HTML5的常用函数总结
May 17 Javascript
JavaScript中的数组遍历forEach()与map()方法以及兼容写法介绍
May 19 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
jQuery给表格添加分页效果
Mar 02 Javascript
vue2.0 路由不显示router-view的解决方法
Mar 06 Javascript
vue项目搭建以及全家桶的使用详细教程(小结)
Dec 19 Javascript
Angular2使用SVG自定义图表(条形图、折线图)组件示例
May 10 Javascript
浅谈vue项目用到的mock数据接口的两种方式
Oct 09 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
php cout&amp;lt;&amp;lt;的一点看法
2010/01/24 PHP
php中debug_backtrace、debug_print_backtrace和匿名函数用法实例
2014/12/01 PHP
php 利用array_slice函数获取随机数组或前几条数据
2015/09/30 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
JQuery实现用户名无刷新验证的小例子
2013/03/22 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
jQuery插件pagination实现分页特效
2015/04/12 Javascript
两种JS实现屏蔽鼠标右键的方法
2020/08/20 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
简单学习JavaScript中的for语句循环结构
2015/11/10 Javascript
基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)
2015/12/28 Javascript
JS基础随笔(菜鸟必看篇)
2016/07/13 Javascript
使用smartupload组件实现jsp+jdbc上传下载文件实例解析
2017/01/05 Javascript
jquery获取select,option所有的value和text的实例
2017/03/06 Javascript
详解angularJs指令的3种绑定策略
2017/04/13 Javascript
Angular.js中控制器之间的传值详解
2017/04/24 Javascript
vue项目中将element-ui table表格写成组件的实现代码
2019/06/12 Javascript
Vue之Mixins(混入)的使用方法
2019/09/24 Javascript
vue ajax 拦截原理与实现方法示例
2019/11/29 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
2020/04/28 Javascript
[01:08:09]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第二局
2016/03/02 DOTA
[49:31]TFT vs Mski Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
Django实现表单验证
2018/09/08 Python
python百行代码自制电脑端网速悬浮窗的实现
2020/05/12 Python
Python collections模块的使用方法
2020/10/09 Python
旧时光糖果:Old Time Candy
2018/02/05 全球购物
时尚设计师手表:The Watch Cabin
2018/10/06 全球购物
俄罗斯香水和化妆品网上商店:NOTINO.ru
2019/12/17 全球购物
经销商培训邀请函
2014/01/21 职场文书
大学毕业自我鉴定范文
2014/02/03 职场文书
工作失误检讨书(3篇)
2014/10/11 职场文书
电子商务实训报告总结
2014/11/05 职场文书
2014年小学语文工作总结
2014/12/20 职场文书
五四青年节活动总结
2015/02/10 职场文书
2015年母亲节活动策划方案
2015/05/04 职场文书
2019年农民幸福观调查的实践感悟
2019/12/19 职场文书