微信支付,支付寶支付的前端js寫法
阿新 • • 發佈:2019-01-08
//建立訂單
function sumbitOrder() { var townId = $("#town option:selected").val() var payType = parseInt($("#payType li i.onzf").attr("data-id")) if (isNaN(payType)) { layer.msg("請選擇支付方式") return } if (!townId) { layer.msg("請選擇要開通的小鎮") return } var json = { payType: payType, townId: townId } $.ajax({ type: 'POST', url: '/order/createOrder', contentType: 'application/x-www-form-urlencoded; charset=utf-8', async: false,//同步請求 data: json, success: function (result) { if (result.code != HTTP_RESULT.OK) { layer.msg(result.msg); return; } console.log(result) switch (parseInt(json.payType)) { case 2://支付寶 window.open('/pay/alipay?orderNumber=' + result.data, "_blank") layer.confirm('請在新的頁面完成支付寶支付', { btn: ['已完成支付', '取消'] //按鈕 }, function (index) { /** 點選已完成支付,去檢查訂單狀態是否支付完成 **/ checkOrder(result.data, index) }, function () { }); break case 1://微信 showWXPayDialog(result.data.qrCodeUrl, result.data.orderNumber) break } }, complete: function () { layer.closeAll("loading") } }); }
//檢查訂單狀態
function checkOrder(orderNumber, index) { $.ajax({ type: 'GET', contentType: 'application/x-www-form-urlencoded; charset=utf-8', url: '/order/checkOrderResult?orderNumber=' + orderNumber, beforeSend: function () { layer.load() }, complete: function () { layer.closeAll("loading") }, success: function (result) { if (parseInt(result) == 5) {//狀態為交易成功 layer.msg("支付成功") setTimeout(function () { window.location.reload() }, 1000) } if (index) layer.close(index) $("#wxPayDialog").hide() } }) }//微信支付
/** * 展示微信支付的對話方塊 * @param qrcode * @param orderNumber */ function showWXPayDialog(qrcode, orderNumber) { new QRCode(document.getElementById('qrcode'), qrcode); layer.open({ type: 1, title: '微信支付', offset: '120px', area: ['460px', '433px'], //寬高 btn: ['已完成支付', '取消'], content: $("#wxPayDialog"), end: function () {// 銷燬該彈出層 $("#wxPayDialog").hide() $("#qrcode").empty() }, yes: function (index) { /** 去檢查訂單狀態是否支付完成 **/ checkOrder(orderNumber, index) } }); }