用html5制作网页拍错分析,使用HTML5拍摄示例代码

复制代码

代码如下：

快照

JavaScript只要上面的HTML元素创建完成，那么JavaScript部分将简单的超乎你想象的简单：

复制代码

代码如下：

window.addEventListener(“DOMContentLoaded”，function(){设置事件监听器，DOM内容加载完成，和jQuery的$.ready()效果差不多。function//){//canvas元素将用于抓拍varcanvas=document.getElementById(“canvas“)，context=canvas.getContext(”2d“)，//video元素，将用于接收并播放摄像头的数据流video=document.getElementById(”video“)，videoObj={”video“：true}，//一个错误的错误函数，在控制台打印错误信息errBack=function(error){if(“object”===typeofwindow.console){console.log(“Videocaptureerror：”，error.code);}};//将视频侦听器放到适当的位置针对标准的浏览器if(navigator.getUserMedia){//标准navigator.getUserMedia(videoObj，function(stream){video.src=stream;

video.play();}，errBack);}elseif(navigator.webkitGetUserMedia){//WebKit前缀的navigator.webkitGetUserMedia(videoObj，function(stream){video.src=window.webkitURL.createObjectURL(stream);video.play();}，errBack);}//对拍摄按钮的事件监听document.getElementById(“快照”).addEventListener(“click”，function(){//画到画布上context.drawImage(video，0，0，640，480);});}，错误)；

最后，记得讲您的网页放到网络服务器下面，然后通过http协议来访问哦。另外，需要浏览器版本较新，并支持HTML5的相关新特性才可以。译者不算称职啦，没有按来翻译。使用的浏览器是chrome28。最后，贴上完整的代码，比较呆板。

复制代码

代码如下：

浏览器网络摄像头

快照