layer.open再次渲染html,子页面调用在父页面打开弹出层,渲染html

  • 使用的版本 layui-v2.5.6
  • 是在父页面弹出层,显示;调用的是父页面的layer.open();

父页面:

html 复制代码
<link href="/layui/css/layui.css" rel="stylesheet" />
<script src="/layui/layui.all.js"></script>
<script src="/script/jquery-1.11.3.min.js"></script>
<script type="text/javascript">

        layui.use(['form', 'element', 'layer', 'util', 'laypage'], function () {
            var form = layui.form
                , layer = layui.layer
                , util = layui.util
                , element = layui.element
                , laypage = layui.laypage;    
        });
</script>

子页面

html 复制代码
<link href="/layui/css/layui.css" rel="stylesheet" />
<script src="/layui/layui.js"></script>
<script src="/script/jquery-1.11.3.min.js"></script>
 <a class="button text-btn" href="javascript:pageConfig.publishWindow('108170163748288' );" style="background:#339900 ;color:#ffffff;padding:2px 4px;border-radius:3px;"><i class="layui-icon layui-icon-release"></i>发布</a>

<script type="text/template" id="win_publish_div">
    <div id="win_wzpublish" class="layui-form" style=" padding:20px; " lay-filter="winpublish">  
            <div class="layui-form" style="padding:20px;">
                <div class="layui-form-item">
                    <select name="selwin_wzpublish" id="selwin_wzpublish">
               <option value="">请选择发布到的栏目</option>
                       <option value="28a18413-9952-41d6-dc97-08dad8ef948e">头条新闻</option>
                       <option value="721171be-9c30-4f25-fa15-08dadb8890d7">勘研动态</option>
                       <option value="3e0ce84e-91a9-47cf-dc96-08dad8ef948e">通知公告</option>
           
                    </select>
                </div> 
                <div style=" ">  
                    <button class="layui-btn layui-bg-orange" id="btnPreview">发布预览</button>
                    <button class="layui-btn  " id="btnPublish" style="margin-left:30px;">确定发布</button>
                </div>
            </div> 
    </div>
</script>
  <script type="text/javascript">
        var parentDOM = top || window;
         layui.use(['laydate', 'form', 'element']   , function(){
            var laydate = layui.laydate;
            日期时间选择器
            //laydate.render({
            //    elem: '#orderPublishDate',
            //    type: 'datetime'
            //});
            //laydate.render({
            //    elem: '#orderEndPublishDate',
            //    type: 'datetime'
            //});

        });

 !function (p) {
            //发布窗口
            p.publishWindow = function (articleId) {
                var width = window.innerWidth - 30;
                if (window.innerWidth >= 1024) {
                    width = 900;
                }
                var boxSize = [width + 'px', '800px'];

                var index = parentDOM.layer.open({
                    type: 1,
                    offset: 'auto',
                    title: '发布文章',
                    area: boxSize, //宽高
                    content: $("#win_publish_div").html(),
                    success: function (layero, index, that) {
                        var winDom = parentDOM.$("win_wzpublish");
                        parentDOM.layui.form.render(null, "winpublish");
                        var   laydate = parentDOM.layui.laydate;

                        //日期时间选择器
                        laydate.render({
                            elem: '#orderPublishDate',
                            type: 'datetime'
                        });
                        laydate.render({
                            elem: '#orderEndPublishDate',
                            type: 'datetime'
                        });

                    }
                });
            }
 

        }(pageConfig);        
相关推荐
3345543228 分钟前
element动态表头合并表格
开发语言·javascript·ecmascript
John.liu_Test30 分钟前
js下载excel示例demo
前端·javascript·excel
Yaml443 分钟前
智能化健身房管理:Spring Boot与Vue的创新解决方案
前端·spring boot·后端·mysql·vue·健身房管理
PleaSure乐事44 分钟前
【React.js】AntDesignPro左侧菜单栏栏目名称不显示的解决方案
前端·javascript·react.js·前端框架·webstorm·antdesignpro
哟哟耶耶1 小时前
js-将JavaScript对象或值转换为JSON字符串 JSON.stringify(this.SelectDataListCourse)
前端·javascript·json
getaxiosluo1 小时前
react jsx基本语法,脚手架,父子传参,refs等详解
前端·vue.js·react.js·前端框架·hook·jsx
理想不理想v1 小时前
vue种ref跟reactive的区别?
前端·javascript·vue.js·webpack·前端框架·node.js·ecmascript
知孤云出岫1 小时前
web 渗透学习指南——初学者防入狱篇
前端·网络安全·渗透·web
贩卖纯净水.1 小时前
Chrome调试工具(查看CSS属性)
前端·chrome
栈老师不回家2 小时前
Vue 计算属性和监听器
前端·javascript·vue.js