在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法


Posted in Javascript onAugust 05, 2016

最近在使用微信、支付宝、百度钱包实现网页支付,对支付成功将自动关闭页面,对于支付失败,将显示错误信息。当在错误页面的时候,点击返回或者Android物理按键上一步的时候,将关闭页面。

在微信、支付宝、百度钱包中,他们对页面关闭进行了封装,传统的window.close()是无效的,必须要使用它们的js代码才能关闭。

下面是三种移动app的关闭方式:

WeixinJSBridge.call('closeWindow');//微信 
AlipayJSBridge.call('closeWebview'); //支付宝 
BLightApp.closeWindow();//百度钱包

通过浏览器的头判断是那种浏览器:

var ua = navigator.userAgent.toLowerCase(); 
f(ua.match(/MicroMessenger/i)=="micromessenger") { 
alert("微信客户端"); 
} else if(ua.indexOf("alipay")!=-1){ 
alert("支付宝客户端"); 
}else if(ua.indexOf("baidu")!=-1){ 
alert("百度客户端"); 
}

对返回、上一页、后退进行监听,并对history中放入当前页地址:

$(function(){ 
pushHistory(); 
window.addEventListener("popstate", function(e) { 
}, false); 
function pushHistory() { 
var state = { 
title: "title", 
url: "#" 
}; 
window.history.pushState(state, "title", "#"); 
} 
});

整个实现完整代码:

$(function(){ 
pushHistory(); 
window.addEventListener("popstate", function(e) { 
pushHistory(); 
var ua = navigator.userAgent.toLowerCase(); 
if(ua.match(/MicroMessenger/i)=="micromessenger") { 
WeixinJSBridge.call('closeWindow'); 
} else if(ua.indexOf("alipay")!=-1){ 
AlipayJSBridge.call('closeWebview'); 
}else if(ua.indexOf("baidu")!=-1){ 
BLightApp.closeWindow(); 
} 
else{ 
window.close(); 
} 
}, false); 
function pushHistory() { 
var state = { 
title: "title", 
url: "#" 
}; 
window.history.pushState(state, "title", "#"); 
} 
});

以上所述是小编给大家介绍的在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
让innerText在firefox火狐和IE浏览器都能用的写法
May 14 Javascript
jquery 年会抽奖程序
Dec 22 Javascript
jquery实现省市select下拉框的替换(示例代码)
Feb 22 Javascript
javascript对中文按照拼音排序代码
Aug 20 Javascript
jQuery不兼容input的change事件问题解决过程
Dec 05 Javascript
js控制页面的全屏展示和退出全屏显示的方法
Mar 10 Javascript
jquery实现表格本地排序的方法
Mar 11 Javascript
JavaScript在Android的WebView中parseInt函数转换不正确问题解决方法
Apr 25 Javascript
jQuery插件Tmpl的简单使用方法
Apr 27 Javascript
javascript 分号总结及详细介绍
Sep 24 Javascript
vue.js实现简单轮播图效果
Oct 10 Javascript
php 解压zip压缩包内容到指定目录的实例
Jan 23 Javascript
浅谈JavaScript中的this指针和引用知识
Aug 05 #Javascript
JavaScript中的this引用(推荐)
Aug 05 #Javascript
JS实现HTML表格排序功能
Aug 05 #Javascript
JavaScript如何实现跨域请求
Aug 05 #Javascript
JavaScript数组操作函数汇总
Aug 05 #Javascript
Jquery获取当前城市的天气信息
Aug 05 #Javascript
JavaScript蒙板(model)功能的简单实现代码
Aug 04 #Javascript
You might like
PHP中的函数-- foreach()的用法详解
2013/06/24 PHP
mac环境中使用brew安装php5.5.15
2014/08/18 PHP
PHP按指定键值对二维数组进行排序的方法
2015/12/22 PHP
PHP插件PHPMailer发送邮件功能
2017/02/28 PHP
filemanage功能中用到的lib.js
2007/04/08 Javascript
JavaScript 变量命名规则
2009/09/23 Javascript
javascipt:filter过滤介绍及使用
2014/09/10 Javascript
js removeChild 方法深入理解
2016/08/16 Javascript
JavaScript之WebSocket技术详解
2016/11/18 Javascript
Node.js中的不安全跳转如何防御详解
2018/10/21 Javascript
socket在egg中的使用实例代码详解
2019/05/30 Javascript
Layui 解决表格异步调用后台分页的问题
2019/10/26 Javascript
javascript实现拖拽碰撞检测
2020/03/12 Javascript
vue+vant使用图片预览功能ImagePreview的问题解决
2020/04/10 Javascript
简单了解three.js 着色器材质
2020/08/03 Javascript
[02:33]DOTA2英雄基础教程 司夜刺客
2013/12/04 DOTA
Python HTMLParser模块解析html获取url实例
2015/04/08 Python
python探索之BaseHTTPServer-实现Web服务器介绍
2017/10/28 Python
Python中的异常处理try/except/finally/raise用法分析
2019/02/28 Python
python实现树的深度优先遍历与广度优先遍历详解
2019/10/26 Python
Python拼接字符串的7种方式详解
2020/03/19 Python
python3爬虫中异步协程的用法
2020/07/10 Python
html5仿支付宝密码框的实现代码
2017/09/06 HTML / CSS
澳大利亚领先的在线美容商城:Adore Beauty
2017/04/14 全球购物
菲律宾优惠券网站:MetroDeal
2019/04/12 全球购物
自动化专业个人求职信范文
2013/11/29 职场文书
电子专业毕业生自我鉴定
2014/01/22 职场文书
高中体育教学反思
2014/01/29 职场文书
入党积极分子自我鉴定范文
2014/03/25 职场文书
学生安全责任书
2014/04/15 职场文书
群众路线专项整治方案
2014/10/27 职场文书
2014年社团工作总结范文
2014/11/27 职场文书
西安事变观后感
2015/06/12 职场文书
微信小程序scroll-view不能左右滑动问题的解决方法
2021/07/09 Javascript
vue elementUI批量上传文件
2022/04/26 Vue.js
Python保存并浏览用户的历史记录
2022/04/29 Python