发帖配图、商品相册都常见：点加号选图，旁边马上出现缩略图，鼠标移上去可以设为首图或删除。本例最多 5 张，只接受 jpg、jpeg、png、gif、bmp。先在浏览器里预览，真正发给服务器放在最后一节。
上传按钮和已选图片的样式如何设计
加号是 .z_file：固定 130×130，底图用 images/bd-sctp.png，上面盖一层透明的 inputtype=file，整块都能点。已选图是 .file-pic，略宽一点（160×130），图片在框里居中，max-width / max-height 都是 100%，避免撑破。
悬停时底部出现半透明条，里面是「设为首图」「删除图片」。两条链接用白色字，可点区域加手型。满 5 张后给 .z_file 加 is-hidden 藏掉加号。
底图、尺寸按设计稿改。列表容器 .z_photo 本例宽 925，窄屏项目里可改成 100% 并允许换行。
选中图片后缩略图怎么显示
选图走 change。取到文件后，用 URL.createObjectURL 生成临时地址，拼一块 .file-pic 插到加号前面。文件对象先挂在节点上（data("file")），后面提交上传时还要用。
选完把 input.value 清空，同一张图才能再次选中触发 change。我第一次看也卡了一下：预览地址只是本地临时链接，刷新页面就没了，正式库里的图仍要靠上传接口落盘。
张数用 MAX_COUNT 控制，满了提示并藏加号：
选了非图片文件时怎么提示
accept 只能减少误选，拦不住改后缀。选中后用扩展名再判一次，不在白名单里就 layer.msg，不生成预览。
提示文案本例是「上传文件格式错误，请重新上传」，按项目改。需要限大小时，在这里加 file.size 判断即可。jQuery 这套建议用 Layui 做提示，具体按实际项目来定。
删除某张图、设为封面怎么做
删除：点 .js-remove，去掉最近的 .file-pic，再 syncAddBtn，不满 5 张时加号回来。
设为首图：点 .js-set-cover，把当前预览挪到加号前面，列表里第一张就是封面。提交时按 DOM 顺序取文件即可，第一张当封面。
事件挂在 body 上委托，预览是后插进页面的也能点。这坑我见过不止一次：只绑一次 click，新出来的「删除」点不动。
预览之后怎么提交到服务器
本地预览通过后，按列表顺序取出每张上的 file，放进 FormData 提交。封面就是第一张。地址、字段名按项目约定换；成功失败用 layer.msg 提示。
MAX_COUNT、允许的后缀、加号底图按需求改。单张大小、压缩可在 buildPreview 前加；本例为了看清预览流程，没有做压缩。