A. html5+js实现二维码扫描的代码

通过下面的代码即可实现:

HBuilder就有调用原生硬件的接口html5++

<!DOCTYPEhtml>

<html>

<head>

<metacharset="utf-8">

<title>CameraExample</title>

<scripttype="text/javascript">

//扩展API加载完毕后调用onPlusReady回调函数

document.addEventListener("plusready",onPlusReady,false);

varr=null;

//扩展API加载完毕,现在可以正常调用扩展API

functiononPlusReady(){

//获取设备默认的摄像头对象

varcmr=plus.camera.getCamera();

B. html5和js如何判断二维码是否扫码

这个怎么判断?没后台光靠页面根本无法判断。你根本就不可能知道用户是不是扫码,本来手机扫码的行为就和页面无关,页面的数据变化要么是来源于后台,要么是用户进行了操作。

C. html5怎么扫描二维码

  1. 扫描二维码的话,取决于手机摄像头。

  2. Html5文件的话,你需要将制作好的二维码图片放在Html5内容里面。

  3. 将建好的网址加在微信公众号,或者是QQ公众的导航上面,或者是网站里面。

  4. 当点击进入页面之后,会看到二维码图片。

  5. 用手机按压图片,APP会提示扫描图片中的二维码?

  6. 点击确定扫描二维码即可。

注释:图片尽量做成像下图一样的,增强二维码的趣味性,吸引其他人扫描。

D. 自己写的html页面怎么加入扫描二维码功能

我这里用jq来写,如果你也要使用这种方法的话就要使用jq的插件来支持;

<scripttype="text/javascript"src="jquery-1.9.1.js"></script><!--jq的插件-->
<scripttype="text/javascript"src="jquery.min.js"></script><!--jq的插件-->

<button>点击</button>
<imgsrc="ewm.png"class="imgewm"/>


$(".imgewm").hide();//这里的意思是浏览器一打开执行这里,把二维码的这张图片先隐藏
$("button").click(function(){
$(".imgewm").show();//当点击button的时候把隐藏的二维码给显示出来
});
});
</script>

E. html5移动端调用手机摄像头扫描二维码并获取二维码信息代码怎么写

html5移动端调用手机摄像头扫描二维码并获取二维码信息代码如下:

[html]view plain

<!DOCTYPEhtml>

<html><head>

<title>HTML5codeReader</title>

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

</head>

<styletype="text/css">

html,body{height:100%;width:100%;text-align:center;}

</style>

<scriptsrc="jquery-1.9.1.js"></script>

<script>

//这段代主要是获取摄像头的视频流并显示在Video签中

varcanvas=null,context=null,video=null;

window.addEventListener("DOMContentLoaded",function()

{

try{

canvas=document.getElementById("canvas");

context=canvas.getContext("2d");

video=document.getElementById("video");

varvideoObj={"video":true,audio:false},

flag=true,

MediaErr=function(error)

{

flag=false;

if(error.PERMISSION_DENIED)

{

alert('用户拒绝了浏览器请求媒体的权限','提示');

}elseif(error.NOT_SUPPORTED_ERROR){

alert('对不起,您的浏览器不支持拍照功能,请使用其他浏览器','提示');

}elseif(error.MANDATORY_UNSATISFIED_ERROR){

alert('指定的媒体类型未接收到媒体流','提示');

}else{

alert('系统未能获取到摄像头,请确保摄像头已正确安装。或尝试刷新页面,重试','提示');

}

};

//获取媒体的兼容代码,目前只支持(Firefox,Chrome,Opera)

if(navigator.getUserMedia)

{

//qq浏览器不支持

if(navigator.userAgent.indexOf('MQQBrowser')>-1){

alert('对不起,您的浏览器不支持拍照功能,请使用其他浏览器','提示');

returnfalse;

}

navigator.getUserMedia(videoObj,function(stream){

video.src=stream;

video.play();

},MediaErr);

}

elseif(navigator.webkitGetUserMedia)

{

navigator.webkitGetUserMedia(videoObj,function(stream)

{

video.src=window.webkitURL.createObjectURL(stream);

video.play();

},MediaErr);

}

elseif(navigator.mozGetUserMedia)

{

navigator.mozGetUserMedia(videoObj,function(stream){

video.src=window.URL.createObjectURL(stream);

video.play();

},MediaErr);

}

elseif(navigator.msGetUserMedia)

{

navigator.msGetUserMedia(videoObj,function(stream){

$(document).scrollTop($(window).height());

video.src=window.URL.createObjectURL(stream);

video.play();

},MediaErr);

}else{

alert('对不起,您的浏览器不支持拍照功能,请使用其他浏览器');

returnfalse;

}

if(flag){

alert('为了获得更准确的测试结果,请尽量将二维码置于框中,然后进行拍摄、扫描。请确保浏览器有权限使用摄像功能');

}

//这个是拍照按钮的事件,

$("#snap").click(function(){startPat();}).show();

}catch(e){

printHtml("浏览器不支持HTML5CANVAS");

}

},false);

//打印内容到页面

functionprintHtml(content){

$(window.document.body).append(content+"<br/>");

}

//开始拍照

functionstartPat(){

setTimeout(function(){//防止调用过快

if(context)

{

context.drawImage(video,0,0,320,320);

CatchCode();

}

},200);

}

//抓屏获取图像流,并上传到服务器

functionCatchCode(){

if(canvas!=null)

{

//以下开始编数据

varimgData=canvas.toDataURL();

//将图像转换为base64数据

varbase64Data=imgData;//.substr(22);//在前端截取22位之后的字符串作为图像数据

//开始异步上

$.post("saveimg.php",{"img":base64Data},function(result)

{

printHtml("解析结果:"+result.data);

if(result.status=="success"&&result.data!="")

{

printHtml("解析结果成功!");

}else{

startPat();//如果没有解析出来则重新抓拍解析

}

},"json");

}

}

</script>

<body>

<divid="support"></div>

<divid="contentHolder">

<videoid="video"width="320"height="320"autoplay>

</video>

<canvasstyle="display:none;background-color:#F00;"id="canvas"width="320"height="320">

</canvas><br/>

<buttonid="snap"style="display:none;height:50px;width:120px;">开始扫描</button>

</div>

</body></html>

F. 我想做一个html5的网页,在网页中可以扫描二维码。(不是安卓,也不是ios)

可以直接使用Google提供的网址二维码API,
具体使用方法,参考Chrome浏览器小乐图客扩展的一键生成网址二维码功能

G. html5怎么做扫描二维码的功能

1.解决的问题:
1.能够在微博客户端呼起摄像头扫描二维码并且解析;
2.能够在原版生浏览器和微信客户权端中扫描二维码并且解析;
2.优点:
web端或者是 h5端可以直接完成扫码的工作;
3.缺点:
图片不清晰很容易解析失败(拍照扫描图片需要镜头离二维码的距离很近),相对于 native 呼起的摄像头解析会有1-2秒的延时。
说明:
此插件需要配合zepto.js 或者 jQuery.js使用
使用方法:
1.在需要使用的页面按照下面顺序引入lib目录下的 js 文件

复制代码
代码如下:

<script src="lib/zepto.js"></script>
<script src="lib/qrcode.lib.min.js"></script>
<script src="lib/qrcode.js"></script>

H. 用HTML5 可以实现二维码扫描识别的功能吗

可以。
实现基本步骤:
操作摄像头,获取图片。
技术要点:MediaStream、GetUserMedia、File api。
利用canvas使用相关算法分析图片识别图片得出结果。
技术要点:getImageData
* 涉及到的技术点浏览器们(包括移动端)支持各异,现阶段要开发并投产还不太现实
* 识别算法是一个难点,不过谢谢github,谢谢开源社区,@Shou Jiesong 的答案中有phonegap的插件地址,支持各种码。

I. 关于HTML的二维码扫描功能

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Barcode Example</title>
<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
// 扩展API加载完毕,现在可以正常调用扩展API
function onPlusReady() {
var e = document.getElementById("scan");
e.removeAttribute( "disabled" );
}
// 从图片中扫描
function scanImg() {
plus.barcode.scan( '_www/barcode.png', function (type,result) {
alert( "Scan success:("+type+")"+result );
}, function (error) {
alert( error.message );
} );
}
</script>
<style type="text/css">
*{
-webkit-user-select: none;
}
html,body{
margin: 0px;
padding: 0px;
height: 100%;
}
</style>
</head>
<body >
<input id="scan" type='button' disabled="disabled" onclick='scanImg()' value='扫描图片'></input>
</body>
</html>

我没有试过 你自己看看

J. html5+js实现二维码扫描

通过下面的代码即可实现:

HBuilder就有调用原生硬件的接口html5++

<!DOCTYPEhtml>

<html>

<head>

<metacharset="utf-8">

<title>CameraExample</title>

<scripttype="text/javascript">

//扩展内API加载完毕后调用onPlusReady回调函数

document.addEventListener("plusready",onPlusReady,false);

varr=null;

//扩展API加载完毕,现容在可以正常调用扩展API

functiononPlusReady(){

//获取设备默认的摄像头对象

varcmr=plus.camera.getCamera();