学做网站培训课程介绍

当前位置:

JS判断手机自动跳转到手机网站

为了让手机用户浏览网站的方便,我们做网站时,会做响应式自适应网站。可以自动判断用户浏览设备进行转换网站版面。如果用户使用手机浏览就跳转到手机网站。

除了自适应网站之外,我们还可在做网站时使用JS判断手机自动跳转到手机网站。方法也是比较简单。

手机网站

如果你有PC网站和手机网站二个版面,例如二者的域名分别是www.xuewangzhan.net和wap.xuewangzhan.net,那么你就可以在PC网站的头部文件里放以下的JS进行判断。


<script type="text/javascript">
        var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate",
       "bada", "nokia", "lg", "ucweb", "skyfire");
        var browser = navigator.userAgent.toLowerCase();
        var isMobile = false;
        for (var i=0; i<mobileAgent.length; i++) {
            if (browser.indexOf(mobileAgent[i])!=-1) {
                isMobile = true;
                location.href = 'http://wap.xuewangzhan.net';
                break;
            }
        }
</script>

这段代码可以判断手机移动设备并跳转手机版,如果是手机访问就跳转到wap.xuewangzhan.net,如果是电脑浏览就不会跳转,仍然是www.xuewangzhan.net。

补充:除了上面的JS判断代码之外,还可以用以下的判断代码来判断手机进行跳转。


<script type="text/javascript">
      //判断浏览器跳转手机站
      try {
        var urlhash = window.location.hash;
        if (!urlhash.match("fromapp")) {
          if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i))) {
            window.location = "/wap/index.html";
          }
        }
      } catch (err) {}
</script>

同样下面的代码也可以判断使用。


<script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="./m/index.html";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 如果我们的网站有港澳台的用户,那么网站特别好是能支持文字简繁互转,这样做能方便不同用户更好的阅读网站内容。那么如何在自己做网站时,实
  • 我们都知道在做网站时,加载的文件越少速度就会越快,包括CSS、JS、图片、数据库等等,特别是门户网站建设更是如此。要减少这些文件的载入,特别
  • 在wordpress模板制作时,我们需要根据不同的情况,进行页面的判断来显示不同的内容。下面是自己做网站论坛把wordpress模板制作教程中常用判断代码汇总
  • wordpress程序的评论头像是自动的调用全球gravatar头像,wordpress程序本身是不支持用户设置头像的,网站后台只支持“对于那些没有自定义头像的用户,
  • 什么是自适应手机网站 视频教程 (1103328 次浏览)
    以下为学做网站论坛关于“什么是自适应手机网站”讲解视频教程。
  • 老师你好,我前几天一直在学习手机站课程,对于课程中的案例网站特别喜欢,自己就跟着课程一步步做了一遍。也做了课程笔记,感觉学到了很多知识。
  • 经常更换wordpress主题,会有一个困扰,就是之前主题的内容区域宽度比较大,很多正文图片的尺寸可能是500px,而换了一个主题,内容区域的宽度比较小,
  • 在日常上网过程中,复制,粘贴是特别寻常不过的了,有时我们在某一网站复制后,粘贴到别的地方时,它会自己加上它网站的一个版权信息链接。比如:此文章转
  • Dreamweaver跳转菜单制作 视频教程 (1123736 次浏览)
    什么是跳转菜单跳转菜单是文档内的弹出菜单,对站点访问者可见,并列出链接到文档或文件的选项。可以创建到整个 Web 站点内文档的链接、到其它 Web
  • 在学做网站论坛的论坛制作课程中,我们讲到如何使用Discuz程序进行论坛网站建设,论坛网站可以任意去发贴。作为管理员的我们可能会发现一些别人发了一