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


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 相关文章推荐
JavaScript中yield实用简洁实现方式
Jun 12 Javascript
JS求平均值的小例子
Nov 29 Javascript
js中iframe调用父页面的方法
Oct 30 Javascript
js无提示关闭浏览器窗口的两种方法分析
Nov 06 Javascript
使用JS读取XML文件的方法
Nov 25 Javascript
基于jQuery的左滑出现删除按钮的示例
Aug 29 jQuery
js 原生判断内容区域是否滚动到底部的实例代码
Nov 15 Javascript
JS随机数产生代码分享
Feb 24 Javascript
jQuery实现鼠标移到某个对象时弹出显示层功能
Aug 23 jQuery
vue-cli脚手架的安装教程图解
Sep 02 Javascript
前端开发之便利店收银系统代码
Dec 27 Javascript
JavaScript异步操作的几种常见处理方法实例总结
May 11 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与MySQL交互使用详解
2006/10/09 PHP
PHP生成便于打印的网页
2006/10/09 PHP
PHP使用Session遇到的一个Permission denied Notice解决办法
2014/07/30 PHP
Javascript继承机制的设计思想分享
2011/08/28 Javascript
web基于浏览器的本地存储方法应用
2012/11/27 Javascript
JavaScript中string转换成number介绍
2014/12/31 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
2015/06/19 Javascript
Javascript函数式编程语言
2015/10/11 Javascript
jQuery解析Json实例详解
2015/11/24 Javascript
js中scrollTop()方法和scroll()方法用法示例
2016/10/03 Javascript
js实现短信发送倒计时功能(正则验证)
2017/02/10 Javascript
VUE开发一个图片轮播的组件示例代码
2017/03/06 Javascript
利用纯js + transition动画实现移动端web轮播图详解
2017/09/10 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
Vue的生命周期操作示例
2019/09/17 Javascript
解决vue自定义指令导致的内存泄漏问题
2020/08/04 Javascript
[07:43]《辉夜杯》公开赛晋级外卡赛战队—TRG训练生活探秘
2015/12/11 DOTA
python结合selenium获取XX省交通违章数据的实现思路及代码
2016/06/26 Python
基于Python __dict__与dir()的区别详解
2017/10/30 Python
python使用PyQt5的简单方法
2019/02/27 Python
使用Python在Windows下获取USB PID&VID的方法
2019/07/02 Python
Python 如何优雅的将数字转化为时间格式的方法
2019/09/26 Python
使用phonegap检测网络状态的方法
2017/03/30 HTML / CSS
Levi’s美国官网:美国著名的牛仔裤品牌
2016/08/19 全球购物
英国玛莎百货澳大利亚:Marks & Spencer Australia
2019/08/30 全球购物
进程的查看和调度分别使用什么命令
2015/03/25 面试题
实习自荐信
2013/10/13 职场文书
《火烧云》教学反思
2014/04/12 职场文书
代理协议书范本
2014/04/22 职场文书
团结就是力量演讲稿
2014/05/21 职场文书
学生打架检讨书
2014/10/20 职场文书
银行客户经理岗位职责
2015/04/09 职场文书
项目战略合作意向书
2015/05/08 职场文书
2015年银行信贷员工作总结
2015/05/19 职场文书
2019年教师节活动策划方案
2019/09/09 职场文书
python中Pyqt5使用Qlabel标签播放视频
2022/04/22 Python