2014-03-31 32 views
0

iam試圖通過javascript做到這一點:1-檢查移動類型,如果ANDROID顯示ANDROID_USERS div如果IPHONE顯示IOS_USERS div 2-顯示上面的分區ONEC只有一次在第一次訪問< - 這項工作成功JavaScript顯示divs取決於移動類型

但檢查的移動型其沒有工作,所以我需要知道,如果我以正確的方式做到這一點我使用

https://chrome.google.com/webstore/detail/user-agent-switcher/lkmofgnohbedopheiphabfhfjgkhfcgf

測試代碼,如果在iPhone上工作和android

我需要知道的是,如果我以正確的方式檢查手機類型?

<head> 
    <style> 
      #IOS_USERS { 
       display: block; 
       display:none; 
      } 

      #ANDROID_USERS { 
       display: block; 
       display:none; 
      } 

    </style> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
<script> 
//check mobile type 
var isMobile = { 
    Android: function() { 
     return navigator.userAgent.match(/Android/i); 
    }, 
    BlackBerry: function() { 
     return navigator.userAgent.match(/BlackBerry/i); 
    }, 
    iOS: function() { 
     return navigator.userAgent.match(/iPhone/i); 
    }, 
    Opera: function() { 
     return navigator.userAgent.match(/Opera Mini/i); 
    }, 
    Windows: function() { 
     return navigator.userAgent.match(/IEMobile/i); 
    }, 
    any: function() { 
     return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); 
    } 

}; 

      function setCookie(cname, cvalue, exdays) { 
       var d = new Date(); 
       d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); 
       var expires = "expires=" + d.toGMTString(); 
       document.cookie = cname + "=" + cvalue + "; " + expires; 
      } 


      function getCookie(cname) { 
       var name = cname + "="; 
       var ca = document.cookie.split(';'); 
       for (var i = 0; i < ca.length; i++) { 
        var c = ca[i].trim(); 
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length); 
       } 
       return ""; 
      } 

      function MarkVisited() { 
       setCookie("visited", "visited", 10) 
      } 

      function ClearCookie(cname) { 
       setCookie(cname, "", 1) 
      } 



      $(document).ready(function() { 

       if (getCookie('visited') == "" && isMobile.iOS()) { 
        $('#ANDROID_USERS').hide(); 
        $('#IOS_USERS').show(); 
       } 
       else if (getCookie('visited') == "" && isMobile.Android()) { 
        $('#ANDROID_USERS').show(); 
        $('#IOS_USERS').hide(); 
       } 
       MarkVisited(); 
      }); 
</script> 
    </head> 
    <body> 

     <div id="IOS_USERS"> 
     IOS 
     </div> 
     <div id="ANDROID_USERS"> 
     ANDROID 
     </div> 
     <button id="ClearCookie" onClick="ClearCookie('visited')">Clear Cookie</button> 
    </body> 

</html> 

回答

0

如果你想與大多數設備,瀏覽器等,以適應您的網站...,我會建議你使用http://getbootstrap.com/2.3.2/getting-started.html ......它反應靈敏,它會自動適應任何設備的網站,但你必須遵循他們的一些指令,如何做佈局設計,網格等。這將節省大量的時間爲每個設備創建單獨的用戶界面。希望這會對你有所幫助。 :)

+0

我需要確保腳本,當我使用我的手機,它顯示IOS_USERS股市,所以我想知道,如果/ /檢查移動類型 工作好或不是 如果你看看它的腳本在正確的方式? – user3469218