zoukankan      html  css  js  c++  java
  • 【Thinkphp5】封装layer弹窗方法

    1 官网下载layer

    2 引入文件:

    <!--layer,官网可下载-->
    <script type="text/javascript" src="/static/home/layer/jquery.min.js"></script> 
    <script type="text/javascript" src="/static/home/layer/layer.js"></script>
    <!--封装JS-->
    <script type="text/javascript" src="/static/home/layer/layershow.js"></script> 

    html代码部分

    <a href="javascript:;" onclick="edit('编辑','/home/ucbs/cate_edite?cate_id={$vo.cate_id}','1','800','500')">编辑</a>

    js部分:

    <script type="text/javascript">
    
    /*编辑*/
    function edit(title,url,id,w,h){
        layer_show(title,url,w,h);
    }
    </script>

    3 layershow.js 

    /*弹出层*/
    /*
        参数解释:
        title    标题
        url        请求的url
        id        需要操作的数据id
        w        弹出层宽度(缺省调默认值)
        h        弹出层高度(缺省调默认值)
    */
    function layer_show(title,url,w,h){
        if (title == null || title == '') {
            title=false;
        };
        if (url == null || url == '') {
            url="404.html";
        };
        if (w == null || w == '') {
            w=800;
        };
        if (h == null || h == '') {
            h=($(window).height() - 50);
        };
        layer.open({
            type: 2,
            area: [w+'px', h +'px'],
            fix: false, //不固定
            maxmin: true,
            shade:0.4,
            title: title,
            content: url
        });
    }
    /*关闭弹出框口*/
    function layer_close(){
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    }
  • 相关阅读:
    关于struts页面跳转的问题
    java中==和equals的区别
    控制广播风暴的方法
    广播风暴的成因及解决办法
    思科FEX配置
    思科vPC技术和配置
    数据中心架构TOR和EOR
    ARP表项及老化时间
    MAC地址表和老化时间
    track 3 list boolean or
  • 原文地址:https://www.cnblogs.com/richerdyoung/p/7146029.html
Copyright © 2011-2022 走看看