Layui 列 显示图片 点击小图 查看大图

原文:https://www.kancloud.cn/miren/miren_study/2161223

自定义列

                            , {
                                field: 'pic1', title: "隐患图片", width: 100
                                , templet: function (d) {
                                    if (d.pic1 == '' || d.pic1 == null) {
                                        return '';
                                    }
                                    return "<img src='" + d.pic1 + "' style='width:50px;' onclick='showBigImage(this)'  />";
                                }
                            }

点击查看大图的方法

                window.showBigImage = function (e) {
                    layer.open({
                        type: 1,
                        title: false,
                        closeBtn: 0,
                        shadeClose: true, //点击阴影关闭
                        area: [$(e).width + 'px', $(e).height + 'px'], //宽高
                        content: "<img src=" + $(e).attr('src') + " />"
                    });
                };
posted @ 2022-02-10 16:11  古兴越  阅读(568)  评论(0)    收藏  举报