关于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 相关文章推荐
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
JavaScript判断一个URL链接是否有效的实现方法
Oct 08 Javascript
JQuery实现简单验证码提示解决方案
Dec 20 Javascript
jsp+javascript打造级连菜单的实例代码
Jun 14 Javascript
jquery遍历checkbox的注意事项说明
Feb 21 Javascript
详谈JavaScript 匿名函数及闭包
Nov 14 Javascript
jQuery事件绑定和委托实例
Nov 25 Javascript
JavaScript中的call方法和apply方法使用对比
Aug 12 Javascript
jQuery基于muipicker实现仿ios时间选择
Feb 22 Javascript
Angularjs手动解析表达式($parse)
Oct 12 Javascript
微信小程序 参数传递详解
Oct 24 Javascript
Vue.js划分组件的方法
Oct 29 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操作mysql执行数据库查询的一些常用操作汇总
2013/06/24 PHP
destoon实现调用热门关键字的方法
2014/07/15 PHP
THINKPHP项目开发中的日志记录实例分析
2014/12/01 PHP
PHP获取photoshop写入图片文字信息的方法
2015/03/31 PHP
关于Yii2框架跑脚本时内存泄漏问题的分析与解决
2019/12/01 PHP
基于jquery的inputlimiter 实现字数限制功能
2010/05/30 Javascript
jQuery $.get 的妙用 访问本地文本文件
2012/07/12 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
基于javascript html5实现多文件上传
2016/03/03 Javascript
JavaScript学习笔记之ES6数组方法
2016/03/25 Javascript
js表单登陆验证示例
2016/10/19 Javascript
真正好用的js验证上传文件大小的简单方法
2016/10/27 Javascript
js遮罩效果制作弹出注册界面效果
2017/01/25 Javascript
详解bootstrap的modal-remote两种加载方式【强化】
2017/01/27 Javascript
Vue2.0组件间数据传递示例
2017/03/07 Javascript
JS实现数组去重,显示重复元素及个数的方法示例
2019/01/21 Javascript
nodejs中使用archive压缩文件的实现代码
2019/11/26 NodeJs
python实现根据月份和日期得到星座的方法
2015/03/27 Python
Python Json序列化与反序列化的示例
2018/01/31 Python
浅谈Tensorflow模型的保存与恢复加载
2018/04/26 Python
详解Python Matplotlib解决绘图X轴值不按数组排序问题
2019/08/05 Python
Python二元赋值实用技巧解析
2019/10/25 Python
Python过滤序列元素的方法
2020/07/31 Python
Vero Moda西班牙官方购物网站:丹麦BESTSELLER旗下知名女装品牌
2018/04/27 全球购物
耐克亚太地区:Nike APAC
2019/12/07 全球购物
瑞典香水、须后水和美容产品购物网站:Parfym-Klick.se
2019/12/29 全球购物
怎么处理XML的中文问题
2015/03/26 面试题
高一自我鉴定
2013/12/17 职场文书
2014年社区庆元旦活动方案
2014/03/08 职场文书
副校长个人对照检查材料思想汇报
2014/10/04 职场文书
2015年法制宣传月活动总结
2015/03/26 职场文书
2016年学校招生广告语
2016/01/28 职场文书
2016年“节能宣传周”活动总结
2016/04/05 职场文书
2016年全国爱眼日宣传教育活动总结
2016/04/05 职场文书
CSS巧用渐变实现高级感背景光动画
2021/12/06 HTML / CSS
一级电子管军用接收机测评
2022/04/05 无线电