1 首页 index.html

<li id="html/barcode.html" onclick="clicked(this.id)">
<span class="item">Barcode
<div class="chs">二维码扫描</div>
</span>
</li>

2 二维码页面:html/barcode.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<title>Hello H5+</title>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript">
var ws=null,wo=null;
var scan=null,domready=false;
// H5 plus事件处理
function plusReady(){
if(ws||!window.plus||!domready){
return;
}
// 获取窗口对象
ws=plus.webview.currentWebview();
wo=ws.opener();
// 开始扫描
ws.addEventListener('show', function(){
scan=new plus.barcode.Barcode('bcid');
scan.onmarked=onmarked;
scan.start({conserve:true,filename:'_doc/barcode/'});
}, false);
// 显示页面并关闭等待框
ws.show('pop-in'); }
if(window.plus){
plusReady();
}else{
document.addEventListener('plusready', plusReady, false);
}
// 监听DOMContentLoaded事件
document.addEventListener('DOMContentLoaded', function(){
domready=true;
plusReady();
}, false);
// 二维码扫描成功
function onmarked(type, result, file){
switch(type){
case plus.barcode.QR:
type = 'QR';
break;
case plus.barcode.EAN13:
type = 'EAN13';
break;
case plus.barcode.EAN8:
type = 'EAN8';
break;
default:
type = '其它'+type;
break;
}
result = result.replace(/\n/g, ''); //分析扫描结果:是URL就跳转 ,不是就提示
if(result.indexOf('http://')==0 || result.indexOf('https://')==0){
plus.nativeUI.confirm(result, function(i){
if(i.index == 0){ back();//返回上一页
plus.runtime.openURL(result);
}else{
back();//返回上一页
}
}, '', ['打开', '取消']);
} else{
back();//返回上一页
plus.nativeUI.alert(result);
}
}
// 从相册中选择二维码图片
function scanPicture(){
plus.gallery.pick(function(path){
plus.barcode.scan(path,onmarked,function(error){
plus.nativeUI.alert('无法识别此图片');
});
}, function(err){
plus.nativeUI.alert('Failed: '+err.message);
});
} </script>
<link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
<style type="text/css">
#bcid {
width: 100%;
position: absolute;
top: 0px;
bottom: 44px;
text-align: center;
}
.tip {
color: #FFFFFF;
font-weight: bold;
text-shadow: 0px -1px #103E5C;
}
footer {
width: 100%;
height: 44px;
position: absolute;
bottom: 0px;
line-height: 44px;
text-align: center;
color: #FFF;
}
.fbt {
width: 50%;
height: 100%;
background-color: #007500;
float: left;
}
.fbt:active {
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.5);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.5);
}
</style>
</head>
<body style="background-color: #000000;">
<div id="bcid">
<div style="height:40%"></div>
<p class="tip">...载入中...</p>
</div>
<footer>
<div class="fbt" onclick="back()">取  消</div>
<div class="fbt" onclick="scanPicture()">从相册选择二维码</div>
</footer> </body>
</html>

MUI 二维码扫描并跳转的更多相关文章

  1. mui 二维码扫描功能

    mui 扫一扫识别二维码 以及多次扫码后从结果页返回时黑屏问题解决  扫一扫页面全部代码 <!doctype html><html>     <head>      ...

  2. iOS - 二维码扫描和应用跳转

    序言 前面我们已经调到过怎么制作二维码,在我们能够生成二维码之后,如何对二维码进行扫描呢? 在iOS7之前,大部分应用中使用的二维码扫描是第三方的扫描框架,例如ZXing或者ZBar.使用时集成麻烦, ...

  3. iOS开发-二维码扫描和应用跳转

    iOS开发-二维码扫描和应用跳转   序言 前面我们已经调到过怎么制作二维码,在我们能够生成二维码之后,如何对二维码进行扫描呢? 在iOS7之前,大部分应用中使用的二维码扫描是第三方的扫描框架,例如Z ...

  4. 微信小程序 空白页重定向---二维码扫描第二次进入 不经过onLoad过程解析scene参数,跳转问题

    在刚开始的时候将小程序的入口文件直接指向tabbar 的首页,此时出现问题:二维码扫描,第一次不关闭首页,第二次进入时:不会经过onLoad过程解析scene参数: 官方中解释:tabbar跳转方式触 ...

  5. [Unity3D]自制UnityForAndroid二维码扫描插件

    一周左右终于将二维码生成和扫描功能给实现了,终于能舒缓一口气了,从一开始的疑惑为啥不同的扫码客户端为啥扫出来的效果不同?通用的扫描器扫出来就是一个下载APK,自制的扫描器扫出来是想要的有效信息,然后分 ...

  6. Android仿微信二维码扫描

    转载:http://blog.csdn.net/xiaanming/article/details/10163203 了解二维码这个东西还是从微信中,当时微信推出二维码扫描功能,自己感觉挺新颖的,从一 ...

  7. iOS二维码扫描IOS7系统实现

    扫描相关类 二维码扫描需要获取摄像头并读取照片信息,因此我们需要导入系统的AVFoundation框架,创建视频会话.我们需要用到一下几个类: AVCaptureSession 会话对象.此类作为硬件 ...

  8. Android 基于google Zxing实现二维码、条形码扫描,仿微信二维码扫描效果

      Android 高手进阶(21)  版权声明:本文为博主原创文章,未经博主允许不得转载. 转载请注明出处:http://blog.csdn.net/xiaanming/article/detail ...

  9. android 二维码扫描

    了解二维码这个东西还是从微信 中,当时微信推出二维码扫描功能,自己感觉挺新颖的,从一张图片中扫一下竟然能直接加好友,不可思议啊,那时候还不了解二维码,呵呵,然后做项目的时候, 老板说要加上二维码扫描功 ...

随机推荐

  1. java资料——顺序存储结构和链式存储结构(转)

    顺序存储结构 主要优点 节省存储空间,随机存取表中元素 缺    点 插入和删除操作需要移动元素 在计算机中用一组地址连续的存储单元依次存储线性表的各个数据元素,称作线性表的顺序存储结构. 顺序存储结 ...

  2. linux/unix 段错误捕获_转

    转自:linux/unix 段错误捕获[续] 本文为“在C/C++中捕获段错误,打印出错的具体位置”的续篇,进一步解决涉及动态链接库的情况.   背景知识: ·linux/unix下动态链接库的基本原 ...

  3. python中copy 与 '=' 的区别

    当你a=1000的时候a指向一个新的类,内容为1000,而b仍然指向原来指向的内容,因为你没有叫它指向其他内容.你使用=符号,使得a和b指向同一个内容,而copy则是将b的内容复制后让c指向这个拷贝的 ...

  4. D方法 自动完成

    控制器 public function insert(){ $Wztj = D("Wztj");if($vo=$Wztj->create()){ if($Wztj->a ...

  5. C++ 有用的书籍

    C++ 有用的书籍Essential C++ 中文版C++ Primer Plus 第6版中文版C++ Primer中文版(第5版) #include <iostream> /* run ...

  6. C++ 程序可以定义为对象的集合

    C++ 基本语法C++ 程序可以定义为对象的集合,这些对象通过调用彼此的方法进行交互.现在让我们简要地看一下什么是类.对象,方法.即时变量. 对象 - 对象具有状态和行为.例如:一只狗的状态 - 颜色 ...

  7. jQuery中 wrap() wrapAll() 与 wrapInner()的差异

    wrap() 方法把每个被选元素放置在指定的 HTML 内容或元素中.jQuery 文档操作 - wrapAll() 方法 wrapAll() 在指定的 HTML 内容或元素中放置所有被选的元素.jQ ...

  8. opengl 模板测试 glStencilOp glStencilFunc

    下面来设置蒙板缓存和蒙板测试. 首先我们启用蒙板测试,这样就可以修改蒙板缓存中的值. 下面我们来解释蒙板测试函数的含义: 当你使用glEnable(GL_STENCIL_TEST)启用蒙板测试之后,蒙 ...

  9. c++ define的用法(转)

    #define是C语言中提供的宏定义命令,其主要目的是为程序员在编程时提供一定的方便,并能在一定程度上提高程序的运行效率,但学生在学习时往往不能 理解该命令的本质,总是在此处产生一些困惑,在编程时误用 ...

  10. c++ json cpp

    一 编译链接 1 在相应官网下载jsoncpp 2 解压得到jsoncpp-src-0.5.0文件 3 打开jsoncpp-src-0.5.0 -> makefiles -> vs71 - ...