Layui下的layer使用iframe弹出层

许久没写博客了,今天蹭一波layer的热度,讲一下简单的使用。没必要那么复杂。

首先要引入,layui的基本文件和layer的,layer的我找了半天没找到。在咱们学校的网课端看到了???!!!

   <script type="text/javascript" src="http://hnust.hunbys.com/plugins/layer/layer.js"></script>
    <script src="/static/js/jquery.min.js" type="text/javascript"></script>
   <link href="/static/layui/layui/css/layui.css" rel="stylesheet" media="all">
    <script src="/static/layui/layui/layui.js" type="text/javascript"></script>

接下来就简单了,比如我点击一个按钮打开弹出层(调用js函数,因为我是php的框架,大家不用看参数)。

  <button class="layui-btn layui-btn-sm layui-btn-danger"
                                    onclick="opter_('{$item.no}')">删除
                                </button>

接下来就是js文件了,记得加js的标签

​
        function opter_(id) {
            layui.use('layer', function () {
                layer.open({
                    type: 2,   //0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)
                    title: '录取',   //tittle
                    area: ['1000px', '600px'],   //width , height
                    content: 'https://www.sumtudou.cn', //url,填个百度都行
                    success: function (layero, index) {
                    },
                    end: function () {
                       location.reload();
                    }
                });
            });
        }

​

 

效果图如下

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值