• 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、执行效果:
     
     
     
  • 相关阅读:
    bash命令
    集群解析
    临时配置网络(ip,网关,dns)+永久配置
    nginx反向代理三台web
    源码安装nginx
    nginx反向代理+三台web+nfs共享存储实现集群配置
    jQuery学习笔记(一):入门【转】
    你是怎么把字符串“2016-11-16” 变为 “16/11/2016” 的? 【转】
    用css画出三角形【转】
    JS中常遇到的浏览器兼容问题和解决方法【转】
  • 原文地址:https://www.cnblogs.com/zhaow/p/9753836.html
Copyright © 2020-2023  润新知