如何仅在 Firefox 上显示/隐藏 jquery 脚本答案

【问题标题】：How to show/hide a jquery script only on Firefox如何仅在 Firefox 上显示/隐藏 jquery 脚本
【发布时间】：2015-08-18 15:06:09
【问题描述】：

尝试仅在 Firefox 浏览器上显示和隐藏 js。 还有另一个question 是关于检测所有 Firefox 版本，但这不是我问题的答案，所以我问了这个问题。

HTML：

<div id="about_me">
This Text color will be change
</div>

仅在 Firefox 上显示：

$("#about_me").addClass("red");

我已经尝试过了，但没有用：

<!--[if Gecko ]>
$("#about_me").addClass("red");
<![endif]-->

并将其显示给其他浏览器并在 Firefox 上隐藏：

$("#about_me").addClass("blue");

如何将 JS 显示到不同的浏览器，文本颜色只会在 Firefox 上显示为红色，在其他浏览器上显示为蓝色。

请看这个Fiddle >>
谢谢。

【问题讨论】：

stackoverflow.com/questions/7000190/…的可能重复
@Jeremy Tille 不，这是完全不同的话题。那是版本检测。 :)
呃，不，那是关于 Firefox 检测，使用if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1)。不是那么“完全不同”:)

标签： javascript jquery firefox browser cross-browser

【解决方案1】：

尝试使用 navigator.userAgent 来检测浏览器

userAgent 属性返回发送的用户代理头的值由浏览器发送到服务器。

返回的值，包含有关名称、版本和浏览器的平台。

if(navigator.userAgent.toLowerCase().indexOf("firefox") > -1){
    $("#about_me").addClass("red");
}
else{    
    $("#about_me").addClass("blue");    
}

Fiddle

About Naviagate Useragent | MDN

注意：在所有浏览器中运行小提琴。我检查了 chrome、safari、IE 和 firefox

【讨论】：

谢谢，你没有使用toLowerCase() 有没有可能出错？一些浏览器以大写或大写形式提供 userAgent。
请将 Firefox 更改为 firefox，因为它不工作。
@Aabira - 感谢您的更新，我实际上忘记了

【解决方案2】：

if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
{
$("#about_me").addClass("red");
}

你也可以这样使用

if(navigator.userAgent.indexOf('Firefox') > -1)
{
$("#about_me").addClass("red");
}

【讨论】：

虽然它可能有效，但不确定它是否比if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1)更简单。
@Techy fiddle 请。
@Aabira 假设某些浏览器以大写或大写形式提供 userAgent，我们并不确切知道浏览器会抛出什么。所以我们防止警告使用 toLowercase() 为 userAgent 使其全部字符串为小写
比如火狐，火狐自带的toLowerCase()就是'firefox'
@Aabira 我已经解释并更改了答案。希望你理解

【解决方案3】：

它应该可以工作：

HTML：

<br>
<div id="about_me">
     This Text color will be change
</div>e here

CSS：

.red { color: red; }
.blue { color: blue; }

JS：

var userAgent = navigator.userAgent.toLocaleLowerCase();  

if(userAgent.indexOf('firefox') > -1) {
    $("#about_me").addClass("red");
} else {
    $("#about_me").addClass("blue"); 
}

小提琴

http://jsfiddle.net/pyg9ynb5/2/

【讨论】：

关于toLocaleLowerCase() 只是将整个用户代理字符串小写。其实没必要，你可以删除，如果你想和'Firefox'比较 if 语句。如果你没问题，请接受我的正确回答。