.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