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

最近在使用微信、支付宝、百度钱包实现网页支付，对支付成功将自动关闭页面，对于支付失败，将显示错误信息。当在错误页面的时候，点击返回或者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", "#");
}
});

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

赞 (0)

相关推荐

  • 基于JS实现类似支付宝支付密码输入框

    基于JS实现类似支付宝支付密码输入框

    本文实现的是一个类似支付宝支付密码的界面,只可以输入数字,且只可以输入6位 首先给大家展示下效果图,如果感觉不错,请参考实现代码. 1.样式表 .wrap{ margin: 10px auto; width: 329px; height: 640px; padding-top: 200px; } .inputBoxContainer{ width: 240px; height: 50px; margin: 0 auto; position: relative; } .inputBoxContai

  • Spring使用支付宝扫码支付

    Spring使用支付宝扫码支付

    前一段一直在研究支付宝的扫码支付,不得不说,支付宝的文档写的真是一个烂(起码在下刚开始看的时候是mengbi的).文档上面的示例和demo里面的示例长的完全不一样.往往文档上面的例子很简单,而demo的代码写的很复杂,所以一开始就不知道该采用哪个代码,后来仔细看了一下demo的那些包里面的代码,发现也是调用的文档示例的那些接口,这才明白它们原来是一个东西,只不过demo对文档的接口进行了一些包装而已. 首先申请一个企业的支付宝账号,这个账号有个pid,需要向这个账号里面添加应用,每个应用都有一个

  • js仿支付宝填写支付密码效果实现多方框输入密码

    js仿支付宝填写支付密码效果实现多方框输入密码

    不知道怎么描述标题,先看截图吧,大致的效果就是一个框输入一位密码. 最开始实现的思路是一个小方框就是一个type为password的input,每输入一位自动跳到下一位,删除一位就自动跳到前一位,android上是OK的,很平滑也没有bug,但是ios上会出现键盘频繁调起和关闭,非常影响用户体验.原因估计是每个input会不断的focus和blur,每次focus会调起键盘,blur又会关闭键盘,so....此方案肯定不行了. PM非要实现这种效果,木有办法~拗不过,一句用户体验不好会让你没话说

  • PHP 接入支付宝即时到账功能

    首先请到支付宝那边申请一个及时到账的接口账户,需要提交相关材料申请.然后根据即时到账的API文档进行接入.API文档提供了各种语言版本的demo,我这里是下的php版demo,然后再进行相关修改操作.你也可以将demo版本的代码重新整合,我这里暂时为了走通充值及时到账流程,就不进行代码重构了. API文档:https://doc.open.alipay.com/docs/doc.htm?spm=a219a.7386797.0.0.eZb8FX&treeId=108&articleId=10

  • 详解java集成支付宝支付接口（JSP+支付宝20160912）

    吐槽一下: 支付宝的接口和微信的DEMO和文档真心太难看懂了,乱七八糟,都不知道去哪里找自己要的东西,最近几天我们公司需要做类似的开发,我作为先锋,率先解决Java集成支付宝支付和微信支付接口工作. 我们的工作环境:JSP网站+支付接口,目前工作的支付宝接口为20160912,微信为V3版本,如遇到版本升级,请联系相关机构的客户服务人员升级. 本文介绍JSP+支付宝接口,本文非原创. 新手注意: 1.本文使用的接口地址和参数为沙箱的地址,无论你在使用沙箱或者正式地址,务必核实使用接口地址和参数,

  • PHP实现支付宝即时到账功能

    PHP实现支付宝即时到账功能

    本文实例为大家分享了PHP支付宝即时到账功能的实现代码,供大家参考,具体内容如下 首先需要下载即时到账交易接口,传送门https://doc.open.alipay.com/doc2/detail?treeId=62&articleId=103566&docType=1 选择(create_direct_pay_by_user) 然后解压,选择MD5签名版本的文件 此文件夹里有个叫create_direct_pay_by_user-PHP-UTF-8的文件,我们就用这个文件~ 接着打开文件

  • Android自定义View系列之Path绘制仿支付宝支付成功动画

    Android自定义View系列之Path绘制仿支付宝支付成功动画

    前言 使用支付宝付款时,我们可以看到成功或者失败都会有个动画提示,如果我们需要做这样的效果的话,当然,你可以让设计师给你做个GIF,但是我们知道图像比较耗内存的,我们自己可以用代码实现还是代码实现好点吧. 效果 实现方法 首先我们需要了解PathMeasure这个类,这个类我们可以理解为用来管理Path.我们主要看几个方法. PathMeasure(): 构造方法 ,实例化一个对象 PathMeasure(Path path,boolean isClosed):传入Path对象和是否闭合,pat

  • 关闭支付宝小额免密支付步骤详解

    关闭支付宝小额免密支付步骤详解

    支付宝现在作为我们日常生活中最常用的应用之一,已经成为了人们的虚拟钱包.但是最近,有人发现了支付宝的一个漏洞,陌生人有1/5的几率可以登陆你的支付宝,熟人可以100%登陆!一起来看看吧! 这个漏洞源于支付宝的一个忘记密码的功能.原理为登录手机账号--忘记密码--手机不在身边--淘宝买过的东西9张图片选1个--好友验证9个好友图片选1个--登录成功. 熟人之间,淘宝购买的东西轻而易举的可以知晓,另外好友验证方面,如果交友圈有重叠的话也可以轻松知道.小编亲测可以轻松登陆同事的支付宝. 可能有的小伙伴

  • php支付宝在线支付接口开发教程

    php支付宝在线支付接口开发教程

    1.什么是第三方支付 所谓第三方支付,就是一些和各大银行签约.并具备一定实力和信誉保障的第三方独立机构提供的交易支持平台.在通过第三方支付平台的交易中,买方选购商品后,使用第三方平台提供的账户进行货款支付,由第三方通知卖家货款到达. 目前提供第三方支付的机构很多,常见的有支付宝.财付通.快钱.网银在线.易宝支付.云网等各大支付平台.网站如果需要实现第三方支付首先应该向第三方支付平台申请一个账号并签署协议,协议生效后第三方支付平台将为其开通在线支付功能,通过程序将接口集成到网站中. 为什么要使用第

  • JS监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

    在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 我相信很多朋友像我一样,在百度.搜狗里面搜索很久都没找到方法. 下面就来告诉大家怎样监听的方法: 首先我们要了解浏览器的history. 大家知道在页面中我们可以使用javascript window history,后退到前面页面,但是由于安

  • Android 仿支付宝密码输入框效果

    Android 仿支付宝密码输入框效果

    模仿支付宝输入效果,实现很简单,就是画个矩形框和圆形,其他的通过组合view来实现所有功能,虽然简单但是封装起来,方便以后使用,也分享一下,希望对别人也有点帮助. 1.如何使用,可以设置自己的进入退出动画,不设置则没有动画效果,自己觉得封装之后还是非常用好的. private MyInputPwdUtil myInputPwdUtil; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(sa

  • js canvas仿支付宝芝麻信用分仪表盘

    js canvas仿支付宝芝麻信用分仪表盘

    这是一个仿支付宝芝麻信用分的一个canvas,其实就是一个动画仪表盘. 首先, 上原图: 这个是在下支付宝上的截图,分低各位见笑了.然后看下我用canvas实现的效果图: <canvas id="canvas" width="400" height="700" data-score='724'></canvas> <!-- 设置data-score,分数区间[400, 900] --> 唉,总感觉不像.这个是G

随机推荐