关于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 相关文章推荐
详谈 Jquery Ajax异步处理Json数据.
Sep 09 Javascript
js将当前时间格式转换成时间搓(自写)
Sep 26 Javascript
D3.js实现饼状图的方法详解
Sep 21 Javascript
React创建组件的三种方式及其区别
Jan 12 Javascript
完美解决UI-Grid表格元素中多个空格显示为一个空格的问题
Apr 25 Javascript
Vue2 使用 Echarts 创建图表实例代码
May 18 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
JS基于for语句编写的九九乘法表示例
Jan 04 Javascript
Vue多组件仓库开发与发布详解
Feb 28 Javascript
前端天气插件tpwidget使用方法详解
Jun 24 Javascript
node.js实现上传文件功能
Jul 15 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 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
虫族 Zerg 历史背景
2020/03/14 星际争霸
PHP.MVC的模板标签系统(三)
2006/09/05 PHP
剖析 PHP 中的输出缓冲
2006/12/21 PHP
在Windows下编译适用于PHP 5.2.12及5.2.13的eAccelerator.dll(附下载)
2010/05/04 PHP
yii分页组件用法实例分析
2015/12/28 PHP
Laravel多域名下字段验证的方法
2019/04/04 PHP
JavaScript 利用StringBuffer类提升+=拼接字符串效率
2009/11/24 Javascript
jquery中选择块并改变属性值的方法
2013/07/31 Javascript
javascript中的遍历for in 以及with的用法
2014/12/22 Javascript
JS清除选择内容的方法
2015/01/29 Javascript
JS实现仿Windows经典风格的选项卡Tab切换代码
2015/10/20 Javascript
JavaScript进阶练习及简单实例分析
2016/06/03 Javascript
用js动态添加html元素,以及属性的简单实例
2016/07/19 Javascript
JS实现移动端按首字母检索城市列表附源码下载
2017/07/05 Javascript
Vue组件实现触底判断
2019/06/26 Javascript
vue 子组件watch监听不到prop的解决
2020/08/09 Javascript
mapboxgl实现带箭头轨迹线的代码
2021/01/04 Javascript
[05:24]TI9采访——教练
2019/08/24 DOTA
phpsir 开发 一个检测百度关键字网站排名的python 程序
2009/09/17 Python
Python中针对函数处理的特殊方法
2014/03/06 Python
Python with的用法
2014/08/22 Python
安装Python的web.py框架并从hello world开始编程
2015/04/25 Python
使用python实现飞机大战游戏
2020/03/23 Python
魅力惠奢品线上平台:MEI.COM
2016/11/29 全球购物
瑞典首都斯德哥尔摩的多元奢侈时尚品牌:Acne Studios
2017/07/09 全球购物
如何查看在weblogic中已经发布的EJB
2012/06/01 面试题
本科生个人求职自荐信
2013/09/26 职场文书
资源工程专业毕业生求职信
2014/02/27 职场文书
最美孝心少年事迹材料
2014/08/15 职场文书
员工生日活动方案
2014/08/24 职场文书
四风问题对照检查整改措施思想报告
2014/10/05 职场文书
总账会计岗位职责
2015/04/02 职场文书
2016猴年开门红标语口号
2015/12/26 职场文书
python正则表达式re.search()的基本使用教程
2021/05/21 Python
python基础之错误和异常处理
2021/10/24 Python
Nginx禁止ip访问或非法域名访问
2022/04/07 Servers