layer.open彈出層應用示例

1、定義一個靜態頁，里面存放需要的HTML，如FlightBookChildInsur.html
在這個頁面定義執行函數，用來返回數據；
function callbackdata() {
    var passengerName = $("#passenger_Name2").val();
    var passengerCertificate = $("#passenger_Certificate2").val();
    var passengerCertificateNum = $("#passenger_CertificateNum2").val();
    var passengerBirthday = $("#passenger_Birthday2").val();
    var passengerSex = $("#passenger_Sex2").val();
    var obj = { "Name": passengerName, "Certificate": passengerCertificate, "CertificateNum": passengerCertificateNum, "Birthday": passengerBirthday, "Sex": passengerSex };
    return JSON.stringify(obj);
}

2、在父頁面定義調用方法，如：
function SetChildInsurMsg(dataIndex) {
    layer.open({
        type: 2, //因為layer彈出層需要一個頁面，所以是iframe彈出層，因此type: 2。
        title: "設置投保人",
        shadeClose: true,
        shade: 0.4,
        area: ['60%', '40%'],
        content: "FlightBookChildInsur.html",
        btn: ['確定', '關閉'],
        yes: function (index) {
            var res = window["layui-layer-iframe" + index].callbackdata();
            var obj = JSON.parse(res);
            var passengerName = obj.Name;
            var passengerCertificate = obj.Certificate;
            var passengerCertificateNum = obj.CertificateNum;
            var passengerBirthday = obj.Birthday;
            var passengerSex = obj.Sex;
            if (passengerName.length > 0 && passengerCertificateNum.length > 0 && passengerBirthday.length > 0 && parseInt(passengerSex)>0) {
                
                layer.close(index);
            }
            else {
                layer.alert('請填寫必輸項。', {
                    skin: 'layui-layer-molv',
                    closeBtn: 0
                });
            }   
        },
        cancel: function () {
            //右上角關閉回調
        }
    });
}

3、執行效果：