JQuery实现判断iPhone和Android设备
2017-09-21 13:53:34  By: shinyuu

最近做了一版微信宣传页、通过JQ来判断设备、并进行下载、微信内置浏览器对下载链接进行了屏蔽、所以先进行判断、如果是微信内置浏览器、则跳转应用宝链接、如果不是、则判断是iPhone/Adroid/PC 并进行跳转


代码如下:

function downloadApp(){
     var u = navigator.userAgent; 
     var ua = navigator.userAgent.toLowerCase(); 
    var isAndroid = u.indexOf(´Android´) > -1 || u.indexOf(´Adr´) > -1; //android终端 
    var isiOS = !!u.match(/(i[^;] ;( U;)? CPU. Mac OS X/); //ios终端 
     if(ua.match(/MicroMessenger/i)=="micromessenger") {  //微信内置浏览器
        $(".download a").click(function(){
            window.location.href=´http://a.app.qq.com/o/simple.jsp?pkgname=应用名 ´
        });
     }else{
         if(isiOS){
        
            $(".download a").click(function(){
                window.location.href=´https://itunes.apple.com/cn/app/应用名´
            });
        }else if(isAndroid){
            $(".download a").click(function(){
                window.location.href=´http://a.app.qq.com/o/simple.jsp?pkgname=应用名´
            });
        }else{
            $(".download a").click(function(){
                window.location.href=´应用链接´
            });
        }
    }
    
 }




测试发现、<a>标签里竟然出现了 需要点击二次才能跳转的情况、所以进行完善、而且发现已经在时间上绑定了click事件 还包在函数里 好像有点多此一举

$(function(){
    var u = navigator.userAgent; 
    var ua = navigator.userAgent.toLowerCase(); 
    var isAndroid = u.indexOf(´Android´) > -1 || u.indexOf(´Adr´) > -1; //android终端 
    var isiOS = !!u.match(/(i[^;] ;( U;)? CPU. Mac OS X/); //ios终端 
    if(ua.match(/MicroMessenger/i)=="micromessenger") {   //微信内置浏览器 应用宝链接
        $(".download a").bind(´touchstart´, function (event) {
            window.location.href=´http://a.app.qq.com/o/simple.jsp?pkgname=应用名 ´
        });
     }else{
         if(isiOS){
            $(".download a").bind(´touchstart´, function (event) {
                window.location.href=´https://itunes.apple.com/cn/app/应用名´
                
            });
        }else if(isAndroid){
            $(".download a").bind(´touchstart´, function (event) {
                window.location.href=´http://a.app.qq.com/o/simple.jsp?pkgname=应用名´
                
            });
        }else{  //PC 端
            $(".download a").click(function(){
                window.location.href=´应用链接´
            });
        }
    
    }
    
});


若资源对你有帮助、浏览后有很大收获、不妨小额打赏我一下、你的鼓励是维持我不断写博客最大动力

想获取DD博客最新代码、你可以扫描下方的二维码、关注DD博客微信公众号(ddblogs)

或者你也可以关注我的新浪微博、了解DD博客的最新动态:DD博客官方微博(dwtedx的微博)

如对资源有任何疑问或觉得仍然有很大的改善空间、可以对该博文进行评论、希望不吝赐教

为保证及时回复、可以使用博客留言板给我留言: DD博客留言板(dwtedx的留言板)

感谢你的访问、祝你生活愉快、工作顺心、欢迎常来逛逛


快速评论


技术评论

  • 该技术还没有评论、赶快抢沙发吧...
DD记账
top
+