layui下layer弹出框（iframe）

一、使用layui弹窗需引入文件jquery.js,jquery-ui.min.css，layer.js，jquery-ui.min.js ，这些文件项目中都有，没有直接去官网下载地址：https://www.layui.com/

 <link rel="stylesheet" href="<%=path %>/skin/js/bootstrap.min.css" type="text/css"><link rel="stylesheet" href="<%=path %>/skin/css/jquery-ui.min.css" type="text/css"><link rel="stylesheet" href="<%=path %>/skin/css/font-awesome.css" type="text/css"><link rel="stylesheet" href="<%=path %>/skin/css/ui.css" type="text/css"><!--<link rel="stylesheet" href="<%=path %>/skin/css/form.css" type="text/css"> --><link rel="stylesheet" href="<%=path %>/skin/datatable/datatables.css" type="text/css"><link rel="stylesheet" href="<%=path %>/skin/css/grid-common.css" type="text/css"><script type="text/javascript" src="<%=path %>/skin/jquery.js"></script><script type="text/javascript" src="<%=path %>/skin/js/bootstrap.min.js"></script><script type="text/javascript" src="<%=path %>/skin/js/form.js"></script> <script type="text/javascript" src="<%=path %>/skin/datatable/datatables.js"></script> <script type="text/javascript" src="<%=path %>/skin/layer/layer.js"></script><script type="text/javascript" src="<%=path %>/skin/js/ui.js"></script> <script type="text/javascript" src="<%=path %>/skin/js/jquery-ui.min.js"></script>

二、此处是调用弹窗js，layuitc()是点击页面中弹窗被调用，

几个参数：parent:是为了解决遮罩层不能覆盖父页面；

type:弹窗类型，此处是使用的iframe

area:定义弹窗的宽度和高度

title:定义弹窗标题和标题的字体大小

content：定义要弹出的页面

<script type="text/javascript">function  layuitc(){parent.layer.open({type:2,//0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）area:['1300px','700px'],title:['修改','15px'],content: context + '/foreigndata/updata?foreignid=05781d60-7e75-406e-a77b-3a784b5f66ae'})}</script>

三、此处定义点击弹出的按钮

<body><button type="button" class="btn ue-btn-primary" onclick="layuitc()" >弹窗</button>
</body>

如果有帮助到你，欢迎各位小伙伴评论点赞。

layui下layer弹出框（iframe）相关推荐

layer 弹出框(iframe层)父子页面传值
父页面获取子页面元素 $("#iframeID").contents().find("#eleID") $("#iframeID").con ...
Layui各种样式弹出框
Layui各种样式弹出框 layer.msg("操作成功", {icon: 1}); layer.msg("操作失败", {icon: 2}); layer.m ...
[小黄书小程序]主页面标签栏水平滑动和下拉弹出框
上一章我们实现了小黄书小程序的搜索栏的界面呈现.这一章我们将会参考小红书实现搜索栏下面的标签栏. 该标签栏存在的意义是,用户可以根据选择的标签来快速呈现相关的内容.该标签栏界面主要是两个功能模块. 一 ...
layer弹出框详细说明
文章目录 1️⃣ layui弹框 1.1 layer.msg 1.2 layer.open 2️⃣ 官方说明优质资源分享 layer 作为 Layui 的代表性组件 ,比 Layui 要出现的早,作 ...
关于使用layer弹出框展现echarts不显示的问题
html页面是这样的 <div id="showScoreDetail" style="display: none;"><div class= ...
【Popover 弹出框】在vue中，ElmentUI下Popover 弹出框组件 “ 自定义样式修改不了 ” 的解决方法
通过 /deep/ 深层查找并不能找到相关的元素,查找原因发现此组件的样式是全局样式,如果你style中加了scoped,如<style lang="scss" scoped ...
微信小程序如何自定义一个可输入筛选的下拉弹出框，也封装成组件。
在开发过程中,经常会遇到下拉框,有些时候内容过多,找起来也不方便,给他增加一个输入框,相当于用户输入某些信息,然后再下拉,符合输入内容的数据将会被展示出来,大大方便了用户操作体验. 话不多说,让我们开 ...
关于layer弹出框出现layer is not underfined的问题
在使用layer弹框的时候,我下了两个版本的layer.一个是3.1.0一个是2.1.5.使用3.1.0直接引用layer.js和layer.css就可以实现弹窗,但是布局好像也有点问题.但是当我用2 ...
layui layer弹出框alert,confim
layer.confirm('内容', {yes:function(){layer.closeAll();//确认按钮如果不能关闭弹框,使用layer.closeAll()进行弹框关闭} });lay ...

layui下layer弹出框（iframe）

layui下layer弹出框（iframe）相关推荐

最新文章

热门文章