layui open传参_layui 打开新页面,并传入参数
layui 打开新页面,并传入参数
使用的 wangEditor 富文本编辑器不带预览的功能，
所以自己实现了下功能；
思路是：
点击打开一个弹窗 or 新页面，
然后页面展示提交后前端页面看到的大概的样子。
涉及到需要把内容传递到打开的 iframe 页面内，
刚好可以利用 layui 携带传参的一个特点。
效果预览：
具体代码实现为：
创建一个 preview.html 预览页面，css 样式来自 wangEditor 官方文档给出的
预览内容/* table 样式 */
table {
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
table td,
table th {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 3px 5px;
}
table th {
border-bottom: 2px solid #ccc;
text-align: center;
}
/* blockquote 样式 */
blockquote {
display: block;
border-left: 8px solid #d0e5f2;
padding: 5px 10px;
margin: 10px 0;
line-height: 1.4;
font-size: 100%;
background-color: #f1f1f1;
}
/* code 样式 */
code {
display: inline-block;
*display: inline;
*zoom: 1;
background-color: #f1f1f1;
border-radius: 3px;
padding: 3px 5px;
margin: 0 3px;
}
pre code {
display: block;
}
/* ul ol 样式 */
ul, ol {
margin: 10px 0 10px 20px;
}
点击事件代码：
layui.use(['jquery','form','layer'], function(){
var $ = layui.jquery,
layer = layui.layer,
form = layui.form;
///预览
$('#preview').on('click',function() {
var w = ($(window).width() * 0.7);
var h = ($(window).height() - 50);
layer.open({
resize: false,
title: '预览',
shadeClose: true,
area: [w + 'px', h + 'px'],
type: 2,
content: '/common/html/preview.html',
success: function (layero, index) {
var body = layer.getChildFrame('body', index);
body.find('#content').append(editor.txt.html());
}
});
});
});
标签：layer,预览,传入,solid,layui,新页面,table,border
来源： https://blog.csdn.net/xianhenyuan/article/details/95199044