layui open 打开多个图片

使用layui批量展示图片

最新推荐文章于 2025-09-11 02:17:42 发布

原创最新推荐文章于 2025-09-11 02:17:42 发布 · 915 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#layui

layui 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种使用layui框架批量加载并展示图片的方法。通过遍历图片数据列表，构造HTML图片标签，最后利用layer模块的open方法以弹窗形式显示所有图片。此方法适用于需要在网页上快速展示多张图片的场景。

前言

使用layui 简单打开多个图片

例子

pictureData = data;
            imghtml = "";
            var imgList = pictureData.imgList;
            for(var i in imgList) {
                var img = imgList[i];
                imghtml += '<img src="' + img +'">'
            }
            layer.open({
                type: 1,
                area: ['600px', '400px'],
                title: false,
                shade: 0.8, // 阴影
                moveType: 1,
                shift: 0, // 打开动画
                content: imghtml
            });