如何深入链接网站

时间:2016-01-31 21:07:49

标签: javascript android html deep-linking

<a class="grey-text text-lighten-3" target="_blank" href="javascript:void(0);" onclick="document.write(yourOS())">Instagram</a>



function yourOS() {
var ua = navigator.platform.toLowerCase();
if (ua.indexOf("android") != -1) {
    document.write(.link("instagram://user?username=owendunnigan"));
} else {
    .link("http://www.instagram.com/OwenDunnigan");
}
}

我正在尝试将应用程序深入链接到我的网站,但我无法弄清楚如何将它带到计算机上的常规旧Instagram,但随后转到Android或iOS设备上的应用程序。我知道链接有效,因为我单独尝试了它们。

2 个答案:

答案 0 :(得分:0)

我会以不同的方式处理这个问题。而不是onclick检查源,我会这样做onload。所以:

    <script>
    function onLoad(){
       var urlLink = "http://www.instagram.com/OwenDunnigan";
       var urlLink2 = "http://www.twitter.com/OwenDunnigan";
       var urlLink3 = "http://www.facebook.com/OwenDunnigan";
       var ua = navigator.userAgent.toLowerCase();
       var isAndroid = ua.indexOf("android") > -1;
       if(isAndroid) {
          urlLink = "instagram://user?username=owendunnigan";
          urlLink = "twitter://user?username=owendunnigan";
          urlLink = "facebook://user?username=owendunnigan";
       }
       document.getElementById('yourLink').setAttribute('href', urlLink);
       document.getElementById('yourLink2').setAttribute('href', urlLink2);
       document.getElementById('yourLink3').setAttribute('href', urlLink3);
    }
    window.onload = onLoad;
    </script>

    <a id="yourLink" class="grey-text text-lighten-3" target="_blank">Link</a>

我在我的Android设备/笔记本电脑上进行了测试,这对两者都有效。

编辑:向下和肮脏的方式。你可以通过为onload函数调用传入变量的函数来创建更多的OOP样式,但为了简单起见,这就可以了。

EDIT2:

<script>
        function getMobileOperatingSystem() {
           var userAgent = navigator.userAgent || navigator.vendor || window.opera;
           if( userAgent.match( /iPad/i ) || userAgent.match( /iPhone/i ) || userAgent.match( /iPod/i ) )
           {
              return 'iOS';
           }
           else if( userAgent.match( /Android/i ) )
           {
              return 'Android';
           }
           else
           {
              return 'unknown';
           }
        }

        function onLoad(){
           var urlLink1 = "http://www.instagram.com/OwenDunnigan";
           var urlLink2 = "http://www.twitter.com/OwenDunnigan";
           var urlLink3 = "http://www.facebook.com/OwenDunnigan";
           switch(getMobileOperatingSystem()){
               case 'Android':
                    urlLink1 = "instagram://user?username=owendunnigan";
                    urlLink2 = "twitter://user?username=owendunnigan";
                    urlLink3 = "facebook://user?username=owendunnigan";
                    break;
               case 'iOS':
                    urlLink1 = "instagram://user?username=owendunnigan";
                    urlLink2 = "twitter://user?username=owendunnigan";
                    urlLink3 = "facebook://user?username=owendunnigan";
                    break;
               default:
                    break;
            }
           document.getElementById('yourLink1').setAttribute('href', urlLink1);
           document.getElementById('yourLink2').setAttribute('href', urlLink2);
           document.getElementById('yourLink3').setAttribute('href', urlLink3);
        }
        window.onload = onLoad;
        </script>

        <a id="yourLink1" class="grey-text text-lighten-3" target="_blank">Link1</a>
        <a id="yourLink2" class="grey-text text-lighten-3" target="_blank">Link2</a>
        <a id="yourLink3" class="grey-text text-lighten-3" target="_blank">Link3</a>

清理代码并从此处滚动函数:Detecting iOS / Android Operating system 您可以通过简单地扩展检测功能和添加案例语句来添加其他系统。当然,我没有添加你通常做的默认case语句,但是我首先调用了变量,所以没有理由在我看来重置它们,但你可以用它做更多的事情。如果这不起作用,请告诉我。

答案 1 :(得分:0)

Munsterlander 解决方案的转换可以这样写,以避免重复:

switch(getMobileOperatingSystem()){
               case 'Android':
               case 'iOS':
                    urlLink1 = "instagram://user?username=owendunnigan";
                    urlLink2 = "twitter://user?username=owendunnigan";
                    urlLink3 = "facebook://user?username=owendunnigan";
                    break;
               default:
                    break;
            }

很抱歉没有回复上述解决方案,但我不能。