Web开发学习——网页上掉用手机拍照

    最近接了一个新的微信公众号项目，需求和费用比较起来可以说是很让人难堪了。不过还是接了下来。毕竟缺钱留学。

    用户希望能够开发能同时在微信和普通浏览器上浏览的网页，并且不愿意同时开发两套（抛了各种原因），emmm，那么微信的库就不太敢使用了。今天在做的时候发现其中一个拍照的需求。刚开始的时候有点尴尬（好久没开发网页了，有点生疏），刚刚上课上一半忽然想到了解决思路，就偷偷逃课来实现这个功能。

    其实要实现这个可以使用<input>标签来实现。具体代码如下    

<input type="file"  capture="image/*" capture="camera"/>

    亲测放到服务器上后在手机上可以实现功能，当然效果非常丑。

    稍作修改

<label class=“newlabelstyle”>
<input type="file" style="position:absolute;left:-9999;visibility:hidden;" id="capture" capture="camera" accept="image/*" class="weui-vcode-btn"/>
<span>获取图片</span>
</label>

    这里我们把input隐藏了，但是点击时依旧能够触发摄像头，现在效果是这样的

    当然你们可以通过修改label的样式，实现各种视觉效果哈。就到这里了。

    DRW