layui自定义内容打印

时间：2024-10-15

layui集成有打印功能，当我们需要自定义内容打印，需要怎么操作呢？以下是具体代码：

<div class="layui-inline">
    <label class="layui-form-label">打印表格</label>
    <table id="table_info">
        <tr>
            <td>7</td>
            <td>8</td>
            <td>9</td>
        </tr>
    </table>
</div>
<div class="layui-inline">
    <a id="printTable" class="layui-btn layui-btn-primary layui-btn-sm">
        <i class="layui-icon layui-icon-print"></i>
    </a>
</div>
<script language='javascript'>
//自定义打印table
$("#printTable").click(function () {
    var v = document.createElement("div");
    var f = ["<head>", "<style>", "body{font-size: 12px; color: #666;}", "table{width: 100%; border-collapse: collapse; border-spacing: 0;}", "th,td{line-height: 20px; padding: 9px 15px; border: 1px solid #ccc; text-align: left; font-size: 12px; color: #666;}", "a{color: #666; text-decoration:none;}", "*.layui-hide{display: none}", ".picture{ }", "</style>", "</head>"].join("");
    $(v).append($("#table_info").html() + "</div>");
    var h = window.open("Print_window", "_blank");
    h.document.write(f + $(v).prop("outerHTML"));
    h.document.close();
    h.print();
    h.close();
})
</script>

上一篇：layui弹出层layer.open中的content问题 下一篇：没有了

layer.open打开的页面关闭时，父页面刷新的方法layer.open打开的页面关闭时，父页面刷新的方法，在layer.open中添加： end: function(){ window.parent.location.reload();//关闭open打开的页面时，刷新父页面 }

layui自定义内容打印

相关文章