您的位置：首页 > 移动开发 > 微信开发

在微信中如何接入支付宝的提示打开浏览器样式：方法二简易方法

2015-05-20 13:38 751 查看
简易方法思路大致如下：

修改现在商品支付确认页面的代码，参照pay.html页面自行编写一个新的html(alipay-weixinbrowser-prompt.html)用于适应alipayapi.jsp的业务逻辑。

商品支付确认页面的支付按钮点击事件代码：

function pay() {

var ua = navigator.userAgent.toLowerCase();

var orderStr = sessionStorage.getItem("order_object");
var order_object = $.parseJSON(orderStr);

//在微信中，跳转页面至alipay-weixinbrowser-prompt.html浏览器提示页，此页面是pay.html的改造页面，带入参数商品订单id
if (ua.indexOf('micromessenger') != -1) {
window.location.href = "alipay-weixinbrowser-prompt.html?orderid=" + order_object.id;
//不在微信中，直接跳转alipayapi.jsp页面，进行支付业务处理
} else {
//设定提交参数alipayapi.jsp页面会根据传入的id查询订单后，进行支付宝的支付请求操作</span>
$("#alipayId").attr("action", WebServices.getAliPayUrl() + "mobileWeb/alipayapi.jsp");
//隐藏商品订单id
$("#id_trade_no").val(order_object.id);
//提交
$("#alipayId").submit();
}
}


alipay-weixinbrowser-prompt.html的body部分代码如下，此页面是通过pay.html改造而来

<body>
<div class="J-weixin-tip weixin-tip">
<div class="weixin-tip-content">
请在菜单中选择在浏览器中打开,<br/>
以完成支付
</div>
</div>
<div class="J-weixin-tip-img weixin-tip-img"></div>
<form name=alipayment id="alipay-form" action="" method=post target="_blank">
<input type="hidden" name="glass_trade_no" id="id_trade_no">
</form>
<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/WebServices.js"></script>
<script>
var ua = navigator.userAgent.toLowerCase();
var tip = document.querySelector(".weixin-tip");
var tipImg = document.querySelector(".J-weixin-tip-img");
if (ua.indexOf('micromessenger') != -1) {
tip.style.display = 'block';
tipImg.style.display = 'block';
if (ua.indexOf('iphone') != -1 || ua.indexOf('ipad') != -1 || ua.indexOf('ipod') != -1) {
tipImg.className = 'J-weixin-tip-img weixin-tip-img iphone'
} else {
tipImg.className = 'J-weixin-tip-img weixin-tip-img android'
}
} else {
//获取url中的商品订单id
var orderid = $.getParam("orderid");
//alipayapi.jsp页面会根据传入的id查询订单后，进行支付宝的支付请求一系列操作
$("#alipay-form").attr("action", WebServices.getAliPayUrl() + "mobileWeb/alipayapi.jsp");
$("#id_trade_no").val(orderid);
$("#alipay-form").submit();
}
</script>
</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航