本文介绍了如何使用HTML Input标签在移动端项目中实现从本地相册选择图片并预览的功能。通过设置input type=file和accept属性，限制选择的文件类型为图片，并使用FileReader API进行异步加载，实现图片预览。同时，文章提供了一个限制上传图片数量为四张的简单示例代码，并提到了后续改进的可能性。
前些日子项目中遇到了一个问题(移动端项目)，就是在反馈页面点击上传图片的时候，实现在本地读取照片并预览的效果，这样的实现效果可以避开把图片上传到服务器在预览的尴尬，具体的页面展示效果如下：
具体的代码如下(偷个懒，也为了大家看的更方便，就截图了...)
在这里面按钮的呈现样式是通过字体实现的，用的是阿里图标库，然后在图标的上面就是图中的input按钮了，只是input给它全透明了，所以我们看到的是一个"十"字的标志，这里面input的类型是file，accept是指上传文件的类型，这里面我们可以对要上传的文件进行一些限制，因为上传的是图片，所以图片的目录是image，此外还有audio、video，但是现在还没有对文件类型进行限制，所以要在他们的后面加上(如图片).gif、.png等等，想省事，那就直接image/*了，这样的话选择的范围也广一些，当然，实际项目中还是需要根据具体要求来做的，这一步做完之后，就会直接调用本地的文件夹了，Android效果如下&#
最低0.47元/天 解锁文章
925
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
