javascript函数根据手机浏览器隐藏和显示超链接？

我正在创建一个针对所有移动平台（i-phone，i-pad，Blackberry，android e.t.c）的移动网站。javascript函数根据手机浏览器隐藏和显示超链接？

<div data-role="header" data-position="inline"> 
    <a href="index.html" data-role="button" data-icon="home"></a> 
    <div id="title">Venue Information</div></div>

上面写的代码是整个网站的标题的一小段代码。正如上面提到的，我想知道是否有可能隐藏中间行是一个按钮图标（超链接到index.html），如果它正在I-Phone和Blackberry上运行，并显示相同的，如果任何其他平台（机器人，桌面等）

任何代码片段将高度赞赏。

mrana ....

来源

2012-03-12 mrana

我不是在移动支持的专家，但我认为，导航器对象可以帮助（例如'window.navigator.platform'） – user544262772 2012-03-12 08:33:40

你为什么要这么做？为什么选择iphone和黑莓？如果你告诉我们为什么，也许有更好的解决方案。在大多数情况下，浏览器/平台嗅探并不是最好的主意。 – kapa 2012-03-12 08:57:58

其实我们正在为手机，黑莓和其他移动平台/桌面（WEB-Version）创建移动应用程序。所以我的任务是为该应用创建移动页面。我们在每个平台上使用这些页面。所以我的问题是，如果我在黑莓和iphone上使用这些页面，那么总是会在每个页面标题上有一个超链接到index.html，如果用户点击他/她从本地平台（BB，Iphone ）我不想要。我也不能删除这个，因为这是在Web应用程序中所需要的。 – mrana 2012-03-12 09:17:53

DEMO

$(document).ready(function() { 
    var supportedMobile = navigator.userAgent.match(/iphone|blackberry|playbook/i); 
    if (supportedMobile) { 
     $("a[data-role='button']").html("You have a(n) "+supportedMobile); 
     if (supportedMobile!="BlackBerry") $("a[data-role='button']").fadeOut('slow'); 
     else $("a[data-role='button']").hide(); // BB does not fade on my 5700 
    }  
});

来源

2012-03-12 10:06:22 mplungjan

我试过，但你的代码不工作..任何想法？ – mrana 2012-03-12 10:38:59

对不起，再次无法正常工作。你有没有自己检查过这个代码？ – mrana 2012-03-12 11:59:23

是的，我做到了。 BB不会褪色，所以现在我隐藏起来。查看已更新的[DEMO]（http://plungjan.name/iphone_bb.html） – mplungjan 2012-03-12 13:02:09

有针对特定类型的问题的一小片天：

http://detectmobilebrowsers.com/

编辑原因的第一个评论下方：

好，所以如果你看看jQuery代码示例，你可以看到： navigator.userAgent || navigator.vendor || window.opera）;

，如果你谷歌，你会得到：

http://www.quirksmode.org/js/detect.html

编辑2：更可见代码

使用下面的代码获取浏览器支持：

if(navigator.userAgent.match(/Android/i) || 
navigator.userAgent.match(/webOS/i) || 
navigator.userAgent.match(/iPhone/i) || 
navigator.userAgent.match(/iPod/i) || 
navigator.userAgent.match(/BlackBerry/) 
){ 
// some code 
}

享受！

来源

2012-03-12 08:37:24

很酷的网站，但不是针对上述问题。该网站上的代码不容易破解，只能检测到许多 – mplungjan 2012-03-12 08:56:46

Overkill中的2个。看我的例子 – mplungjan 2012-03-12 10:59:40

这是一个更广泛的答案，所以它不是矫枉过正，它只是不那么具体，与附加的资源，它告诉更广泛的受众 – 2012-03-12 11:03:25

如果情况适合，你可以隐藏的链接，如果用户的屏幕尺寸太小：

<style> 
@media screen and (max-device-width: 480px) { 
.hideifsmall {display: none} 
} 
</style> 

<a href="index.html" class="hideifsmall" data-role="button" data-icon="home"></a>

来源

2012-03-12 08:54:58

谢谢，但有点不合逻辑。 – mrana 2012-03-12 08:59:55

javascript函数根据手机浏览器隐藏和显示超链接？

回答

相关问题