第一种方法：　　

//WeixinJSBridge 是微信内置对象，支付功能只能在微信端才能使用
function wxPay(){
    //需要先判断是否是微信浏览器，并且微信内置包是否加载完成
    //有时会出现当触发事件的时候微信内置包还未加载完成，必须加上下面判断
    if(typeof WeixinJSBridge == "undefined") {
        if(document.addEventListener) {
            document.addEventListener(‘WeixinJSBridgeReady‘, onBridgeReady, false);
        } else if(document.attachEvent) {
            document.attachEvent(‘WeixinJSBridgeReady‘, onBridgeReady);
            document.attachEvent(‘onWeixinJSBridgeReady‘, onBridgeReady);
        }
    } else {
        //执行下面方法
        //传入下面参数,这些参数需要从后台获取
        onBridgeReady(appId,timeStamp,nonceStr,package,paySign);
    }
}

//api方法
function onBridgeReady(appId,timeStamp,nonceStr,package,paySign) {
    WeixinJSBridge.invoke(
        ‘getBrandWCPayRequest‘, {
            "appId": appId, //需要在微信绑定商户号，成功之后会生成有appid   
            "timeStamp": timeStamp, //时间戳，自1970年以来的秒数，前端需要从后台获取该数据     
            "nonceStr": nonceStr, //随机串，前端需要从后台获取该数据     
            "package": package,//前端需要从后台获取该数据     
            "signType": "MD5", //微信签名方式,默认为"MD5",也可以从后台获取
            "paySign": paySign //微信签名，前端需要从后台获取该数据 
        },
        function(res) {
            //这个步骤非常重要，调试期间会报上相应的错误信息，因为微信调试工具是无法实际支付的，并且微信上是无法调试的，只能在这里alert
            alert(res.err_msg);
            if(res.err_msg == "get_brand_wcpay_request:ok") {
                //购买成功之后需要做的事...
                alert(‘购买成功‘);
            } // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
        }
    );
}


第二种方法：
如果是公众号h5页面的话，可以通过配置微信签名然后通过微信jsapi接口文档来调用

wechat.chooseWXPay({
  timestamp: 0, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
  nonceStr: ‘‘, // 支付签名随机串，不长于 32 位
  package: ‘‘, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
  signType: ‘‘, // 签名方式，默认为‘SHA1‘，使用新版支付需传入‘MD5‘
  paySign: ‘‘, // 支付签名
  success: function (res) {
    // 支付成功后的回调函数
  }
});

调用微信支付