微信支付：H5吊起支付API，不顯示確認支付、輸入密碼界面

文章出處

使用公眾號進行支付，官方開發幫助文檔：

https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1

其業務流程如下：

微信內網頁支付時序圖

按照業務流程進行開發，依據官方的例子（下載地址：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1），不能彈出選擇支付方式及輸入密碼，頁面js代碼如下：

              //調用微信JS api 支付
               function jsApiCall()
               {
                   WeixinJSBridge.invoke(
                   'getBrandWCPayRequest',
                   <%=wxJsApiParam%>,//josn串
                    function (res)
                    {
                        WeixinJSBridge.log(res.err_msg);
                        alert(res.err_code + res.err_desc + res.err_msg);
                     }
                    );
               }

               function callpay()
               {
                   if (typeof WeixinJSBridge == "undefined")
                   {
                       if (document.addEventListener)
                       {
                           document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                       }
                       else if (document.attachEvent)
                       {
                           document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                           document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                       }
                   }
                   else
                   {
                       jsApiCall();
                   }

js調用是通過服務端button按鈕實現，如：

<asp:Button ID="submit" runat="server" Text="立即支付" OnClientClick="callpay()" style="width:210px; height:50px; border-radius: 15px;background-color:#00CD00; border:0px #FE6714 solid; cursor: pointer;  color:white;  font-size:16px;" />

原因分析：

點擊submit按鈕，頁面直接回傳了，頁面狀態已改變，WeixinJSBridge.invoke未能實現異步調用。

解決辦法：

方案一：把submit服務端button更換為html客戶端button

方案二：修改js代碼，防止服務端button回傳，增加如下語句window.event.returnValue = false;

        function jsApiCall()
        {
            try {
                WeixinJSBridge.invoke(
                    'getBrandWCPayRequest',
                    <%= WxJsApiParam %> ,
                    function(res) {
                        WeixinJSBridge.log(res.err_msg);
                        alert(res.err_code + res.err_desc + res.err_msg);
                    }
                );
            } catch (e) {
                alert(e);
            }
        }

        function callpay()
        {
            try {
                if (typeof WeixinJSBridge == "undefined") {
                    if (document.addEventListener) {
                        document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                    } else if (document.attachEvent) {
                        document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                        document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                    }
                } else {
                    jsApiCall();
                }
            } catch (e) {
                alert(e);
            }
            window.event.returnValue = false;
            return false;
        }