标签：parent show layUI title 杂记 layui table news 页面

• 在使用layui的过程中，我发现我对父页面使用的是table表格， table表格中渲染的是a标签，点击数据调转到具体显示页面。关于table表格渲染a标签，可以参考另外一篇文章。

// 给表格添加a标签； 添加show_schedule_detail点击事件
<script type="text/html" id="checkboxTpl">
  <a href="javascript:;" onclick="show_schedule_detail({{ d.id }})">{{ d.title }}</a>
</script>
 
<div style="padding: 10px;">
    <table class="layui-hide" id="test" lay-filter="test"></table>
</div>
 
<script>
    parent_show_type = parent.show_type;
    // 渲染表格
    layui.use('table', function () {
        var table = layui.table;
 
        table.render({
            elem: '#test'
            , url: '${SITE_URL}news/show/details/'
            , method: 'post'
            , where: {
                'check_type': parent_show_type
            }
            , cols: [[
                , {field: 'release_time', title: '发布时间', width: 102}
                , {field: 'title', title: '标题', templet: '#checkboxTpl'}
                , {field: 'user', title: '发布者', width: 160}
            ]]
            , page: true
            , limit: 15
            , limits: [15, 30, 45]
        });
 
    });
    // 点击事件
    function show_schedule_detail(show_id) {
        layer.open({
            type: 2
            , skin: 'layui-layer-rim' // 加上边框
            , area: ['100%', '100%'] // 区域
            , closeBtn: false  // 去掉关闭按钮
            , title: false // 去掉标题
            , shade: 0.8 // 阴影部分
            , content: '${SITE_URL}news/newsletters/examine/' + show_id + '/?to_show=1'
        });
    }
</script>
```
 
下面我们来看  具体信息页面
 
```html
<div class="lg-container">
    <div class="post-container">
        <center><h2>${ run_news.title }</h2></center>
        <p class="post-info-group" id="c">
            % if run_to_show:
            <!-- 给返回上一层添加点击事件 -->
            <a href="javascript:;" style="float: left;" onclick="to_a()">返回上一层</a>
            % endif
            <span id="a">发表时间：${ run_news.release_time } </span>
            <span id="b">作者：${run_news.user.username} </span>
 
        </p>
        <hr class="layui-bg-black">
        <article class="post-content" id="post-content">
            ${run_news.content}
        </article>
    </div>
</div>
<script>
    // 点击事件 关闭子页面，刷新父页面
    function to_a() {
        var index=parent.layer.getFrameIndex(window.name);//获取当前弹出层的层级
        window.parent.location.reload();//刷新父页面
        parent.layer.close(index);//关闭弹出层
    }
</script>

标签：parent,show,layUI,title,杂记,layui,table,news,页面
来源： https://www.cnblogs.com/guojie-guojie/p/16194785.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。