layui中实现弹出层的确定与取消操作

实现弹出层的确定与取消操作的两种方式

一、利用content中用元素生成的确定与取消按钮

<div id="wrapper"><button type="button">点击</button>
</div>

<script src="./assets/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script><script src="./assets/layui/lay/modules/layer.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript">$("button[type=button]").click(function(){layer.open({title:"标题",type:0,area: ['420px', '240px'],content:`<div class="btnCon"><button type="button" id="confirm">确定</button><button type="button" id="cancel">取消</button></div>`,success:function(){//弹出层弹出后回调$("#confirm").click(function(){alert(0)})$("#cancel").click(function(){alert(1)})},})})</script>

二、利用layui中弹出层的btn属性

$("button[type=button]").click(function(){layer.open({title:"标题",type:0,btn:["确定","取消"],area: ['420px', '240px'],content:``,success:function(){//弹出层弹出后回调},btn1:function(){alert(0)},btn2:function(){alert(1)}})})

layui中实现弹出层的确定与取消操作相关推荐

layui点击弹出层中按钮，关闭弹出层
layui点击弹出层中按钮,关闭弹出层原理:点击自己定义的button时,触发弹出层右上角取消按钮. <button type="button" lay-submit=&q ...
uniapp中使用弹出层
uniapp中使用弹出层因为业务的需要,需要弹出一个复选框, 使用uniapp中自带的框架使用: 第一步:下载下示例项目,找到主要的文件夹第二步:将该文件夹放到组件的地方第三步:使用 1· 2 ...
element-ui中$confirm弹出框的确定和取消按钮互换位置
element-ui中$confirm弹出框的确定和取消按钮互换位置 (1)定位元素 (2)找到元素class,通过flex布局,进行位置更换 (3)app.vue中进行全局修改 /* 确认窗取消 ...
layui如何隐藏弹出层关闭的按钮
layui默认弹出层是带有关闭按钮的,但是在某些场景我们不需要layui的关闭按钮,这时只需添加closeBtn :0即可效果图如下: 示例代码如下: layui.use('layer', func ...
layui两个html传值,Layui(二级页面) 弹出层打开页面|传递参数
一级弹出层:弹出打开页面 layer.open({ type: 2, title: '添加用户', content: '../user/goAdd', area: ['460px', '450px'] ...
Vant-ui中digLog弹出层样式出错
Vant-ui-digLog弹出层样式出错最近在开发项目的时候,发现使用框架(Vant-ui)快速搭建页面时,样式出错.这时候一般有两种解决思路: 查看是否有样式污染查看是否有其他ui框架干扰 ...
layui弹出层（确定、取消）
1.通过ajax方法传值判断是否为空,不为空就弹出确定.取消的弹出层 function doSubmitForm() {var gjc = document.getElementById(" ...
layui的确认弹出层的玩法
项目中用的windows的confirm确认框感觉很low 改了一下遇到两个问题使用layui前: function outExcel(url) {if (confirm("导出前请确 ...
交换element-ui中$confirm弹出框的确定和取消按钮位置
使用element-ui的MessageBox组件时,用到了$confirm弹出框,它的默认样式是这样子的: 在项目开发中,为了保持风格的统一,UI给的切图都是确定在左,取消在右,且居中显示,类似如下 ...

layui中实现弹出层的确定与取消操作

实现弹出层的确定与取消操作的两种方式

layui中实现弹出层的确定与取消操作相关推荐

最新文章

热门文章