.NET Core 框架笔记（一）：使用 layer 弹出框

一、参考官网

// 官网网址
http://layer.layui.com/hello.html
// 使用方法
// 获得 layer 文件包后，解压并将 layer 整个文件夹（不要拆分结构） 存放到你项目的任意目录，使用时，只需引入 layer.js 即可。

二、使用方法

1、将layer文件夹放到项目文件夹内（我统一将插件放在wwwroot/lib文件夹内）

2、在需要使用到layer的页面的HTML文件中引入

@{
    ViewBag.Title = "費用規則簽核";
}

<link rel="stylesheet" href="~/lib/jquery.tablesorter/css/style.css" />
<script src="~/lib/layer/layer.js"></script>

3、在需要的地方触发弹出框（例html文件中）

<script>
   function openTollsReturnView(){
    var contentInfo= tableToClass();      
    $.post("/DLR007/AddTollsReturnView",
    contentInfo,
    function(data){
        if(data.status=='Danger'){
            layer.alert(data.msg);
            return;
        }
        var index =layer.index + 1;
        layer.open({
            type: 1,
            title:'路費(返)',
            skin: 'layui-layer-rim my-layer2', //加上边框
            area: ['auto', 'auto'], //宽高
            btn: ['確定', '取消'],
            content: data,
            yes:function(){                    
                // 点击定触发的事件
            },
            btn2: function(){
                parent.layer.close(layer.index);
            }
        });  
    });
};
</script>

三、常用的一些属性（详见官网）

1、宽高

area: ['600px', 'auto'],   //宽高

2、边框

skin: 'layui-layer-rim my-layer2', //加上边框

3、弹框位置

offset:"100px", // 距离顶部100px