layui与layer同时引入冲突的问题
之前在项目中只有用layer,但是后来有用到了layui,结果发现同时引入这两个东东 会出现冲突的问题
导致代码运行不正常
后来网上找到了解决办法:
学习源头:http://fly.layui.com/jie/10143/
官方文档:http://fuxiao.io/practice/docs/#/layui/layer/quickstart?id=layui-%e6%a8%a1%e5%9d%97%e5%8c%96%e4%bd%bf%e7%94%a8-%e8%a7%84%e8%8c%83%e5%8c%96%e7%9a%84%e7%94%a8%e6%b3%95%ef%bc%88%e6%8e%a8%e8%8d%90%ef%bc%89
只需要引入layui即可 因为layer其实也是layui的一个组件;
在js中添加这一行代码:
<link href="{{ asset('layui/css/layui.css') }}" rel="stylesheet">
<script src="{{asset('layui/layui.all.js')}}"></script>
js中这样使用:
var layer = layui.layer;
下面就可以肆无忌惮的使用layer了
上面的方法还是有问题的:有时候用layer.all.js会出现无效的状况
还是要使用layer.js
这就需要
layui.use('layer', function(){
var layer = layui.layer; });
在每使用一次layer的使用定义layer 虽然有点麻烦 但是还是可以解决问题的
layui与layer同时引入冲突的问题的更多相关文章
- layui(二)——layer组件常见用法总结
layer是layui的代表作,功能十分强大,为方便以后快速配置这里对其常见用法做了简单总结 一.常用调用方式 //1.普通消息:alert(content,[options],[yesCallBac ...
- JavaScript中解决jQuery和Prototype.js同时引入冲突问题
两个库同时都定义了一个叫$的函数,所以在同时使用的时候会发生冲突.jQuery( http://jquery.com/ https://jquery.org/ )中提供了一种返还$的使用权给其他js库 ...
- layui之layer打开table后分页无效的解决方法
1.原代码: <body> <div id="showalladdableavms" style="display: none;width:100%&q ...
- JS中通过LayUI的layer.prompt弹出文本输入层,多个按钮回调获取输入值
JS中通过LayUI弹出文本输入层,多个按钮回调: 如图所示,输入文本后点击通过/不通过按钮回调获取输入文本值的实现: 实现JS: layer.prompt({ formType: 2, // 弹出文 ...
- layui的layer.open()方法查看缩略图 原图缩放
写在前面 需求是页面上的图片缩略图, 鼠标悬浮时显示原图片, 并按比例缩放. 操作步骤 官方文档 点击跳转 关键属性 1. type: 设置type=1, 以页面的形式展示图片 2. content ...
- 【layui】layer.photos 相册层动态生成Img 中出现的问题的解决方案
layui版本:2.5.5 参照文档:https://www.jianshu.com/p/c594811fa882 他的3.8的解决方案有一些调整因为发现他的解决方式有些繁琐而最新的2.5.5版本中有 ...
- layui的layer独立版报错“TypeError: i is not a function”的解决
折腾良久发现是引入jQuery顺序的问题. jQuery必须在layer引入之前引入.
- layui关闭layer.open打开的页面
var index = parent.layer.getFrameIndex(window.name); //获取窗口索引parent.layer.close(index);
- layui的layer.msg,form提交
layer.msg('提示文字',{shift:1,time:2000},function(){ location.reload();});其中shift是提示框的动画样式,-1为无动画form.on ...
随机推荐
- 详细Http状态查询
状态代码 状态信息 含义 100 Continue 初始的请求已经接受,客户应当继续发送请求的其余部分.(HTTP 1.1新) 101 Switching Protocols 服务器将遵从客户的请求转 ...
- java中HashMap集合的常用方法
public Object clone() 返回hashMap集合的副本 其余的方法都是实现Map集合的 https://www.cnblogs.com/xiaostudy/p/9510763.htm ...
- Mac OS X 下部分Android手机无法连接adb问题之解决方案
[原文] 时至当今,Android山寨手机厂商已如此之多,能修改和个性化定制Android OS的能人已是多如牛毛,有的牛人修改Android系统只会影响所修改的点,不会影响其它,然后还有的就不多说 ...
- JDK_环境变量
1. 在系统环境变量中设置: ClASSPATH中输入: ".;C:\Program Files\Java\jdk1.7.0_07\jre\lib\rt.jar;"//java的安 ...
- zend studio 添加xdebug调试php代码
1.Eclipse下对于大部分语言都提供了调试器接口,自然的对于PHP,Zend已经集成了XDebug调试器,找到Zend中的Preferences->PHP->Debug, 将调试器设置 ...
- POJ 2502 最短路
http://poj.org/problem?id=2502 同一条地铁线上的站点相邻点间按照v2建边,然后所有点之间按照v1更新建边,所有的边都是双向边,both directions. 然后直接跑 ...
- WeChat on Web 部分功能模拟实现
Flask from flask import Flask,request,render_template,session,jsonify import time import requests im ...
- java事务(三)——自己实现分布式事务
在上一篇<java事务(二)——本地事务>中已经提到了事务的类型,并对本地事务做了说明.而分布式事务是跨越多个数据源来对数据来进行访问和更新,在JAVA中是使用JTA(Java Trans ...
- [置顶]
C语言学习入门
编译文件:cc -c one.c two.c 生成.o目标文件 链接文件:cc one.o two.o 默认生成 a.out 执行文件 指定生成的可执行文件名 cc -o one one ...
- Linux 下spark安装
一.安装前提: 1.java环境(jdk1.8) 2.scala环境(2.0) 3.python 环境(3.5) :注如果使用pyspark的话,这个才是必须的. 二.spark安装 在官网下载安装 ...