jQuery判断是否微信客户端打开网页并默认选中微信支付

做网站时候遇到多种支付选中，想根据打开客户端类型来显示支付方式。

今天就来说说用js实现判断是否微信打开，如果是微信打开就隐藏微信扫码支付和支付宝支付，默认选中微信jspi支付。反之就显示支付宝支付和微信扫码支付，并默认选中微信扫码支付。

具体看下面案例的代码：

<script type="text/javascript" src="/js/jquery.min.js"></script> <!--引入jQuery库-->

<!--支付种类选择-->
<div>
  <label id="alipay">
       <input name="pay_type" type="radio" value="1">
    <span>
       支付宝支付
    </span>
  </label>
   
  <label id="jspi">
      <input name="pay_type" type="radio" value="2">
    <span>
      微信jspi支付
    </span>
  </label>
   
   <label id="native">
          <input name="pay_type" type="radio" value="3">
    <span>
          微信扫码支付
    </span>
   </label>   
   
</div>

<!--js代码-->
<script type="text/javascript">
var wx= (function(){
    return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1
}
)();
//判断是否微信打开
if(wx){
        //是微信打开
        document.getElementById("native").style.display="none";
        document.getElementById("alipay").style.display="none";
        $("input:radio[value='2']").prop('checked', true);     //选中value值为2的radio
    }else {
        //不是微信打开
          document.getElementById("jspi").style.display="none";
          $("input:radio[value='3']").prop('checked', true);   //选中value值为3的radio
    }
</script>

好了，通过上面的案例代码，就可以实现js判断是否微信打开支付页面，隐藏非微信客户端可以使用的支付类型，默认选中适合当前客户端使用的支付类型。

非微信客户端打开效果图展示：

微信客户端打开效果图展示：

如果你正好有类似需求，就试试看吧。