通过浏览器检测来隐藏html表单

我的问题是如何根据浏览器用户使用什么隐藏一些html元素。对于浏览器检测部分，我已完成。这些是铬的东西返回“真”或“假”用于后面的条件。我缺少什么代码来连接js if/else部分以隐藏登录字段。或其他更好的方法来执行此操作？谢谢。通过浏览器检测来隐藏html表单

\t \t // Firefox 1.0+ 
 
    var isFirefox = typeof InstallTrigger !== 'undefined'; 
 
    
 
    // Chrome 1+ 
 
    var isChrome = !!window.chrome && !!window.chrome.webstore; 
 
    
 
    // Edge 20+ 
 
    var isEdge = !isIE && !!window.StyleMedia; 
 
    
 
    // Internet Explorer 6-11 
 
    var isIE = /*@[email protected]*/false || !!document.documentMode; 
 
    
 
     
 
var output = 'Detecting browsers:<hr>'; 
 
output += 'isFirefox: ' + isFirefox + '<br>'; 
 
output += 'isChrome: ' + isChrome + '<br>'; 
 
output += 'isEdge: ' + isEdge + '<br><br>'; 
 

 
document.getElementById("browser").innerHTML = output; 
 

 
//if (isChrome==true){ 
 
// \t $(".LoginField").css("visibility","hidden"); 
 
//}

.visible { 
 
    visibility: visible; 
 
} 
 

 
.not-visible { 
 
    visibility: hidden; 
 
} 
 

 
.LoginField{ 
 
    visibility: visible; 
 
}

<p class="visible">The first paragraph is visible.</p> 
 
<p class="not-visible">The second paragraph is NOT visible.</p> 
 

 
<div id="browser"></div> 
 
<div class="LoginField">login fields</div>

来源

2017-09-06 KenyKeny

什么你可能缺少的是$（文件）。就绪（函数（）{}）你应该把你的if语句包装进去。 –

@LeoFarmer为什么？通过添加'$（document）.ready（function（）{}）'，这个函数跟踪全局的id和class？ – KenyKeny

你的代码工作完全按照预期的，只要你有记得包括在页面上的jQuery。话虽如此，你可以简单地检查if (isChrome) - 你不需要检查它是否等于true。你也不需要CSS来说明.LoginField默认是可见的。

这里的工作例如，在登录凭证上的每一个浏览器中可见而Chrome：

// Firefox 1.0+ 
 
var isFirefox = typeof InstallTrigger !== 'undefined'; 
 

 
// Chrome 1+ 
 
var isChrome = !!window.chrome && !!window.chrome.webstore; 
 

 
// Edge 20+ 
 
var isEdge = !isIE && !!window.StyleMedia; 
 

 
// Internet Explorer 6-11 
 
var isIE = /*@[email protected]*/ false || !!document.documentMode; 
 

 

 
var output = 'Detecting browsers:<hr>'; 
 
output += 'isFirefox: ' + isFirefox + '<br>'; 
 
output += 'isChrome: ' + isChrome + '<br>'; 
 
output += 'isEdge: ' + isEdge + '<br><br>'; 
 

 
document.getElementById("browser").innerHTML = output; 
 

 
if (isChrome) { 
 
    $(".LoginField").css("visibility", "hidden"); 
 
}

.visible { 
 
    visibility: visible; 
 
} 
 

 
.not-visible { 
 
    visibility: hidden; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<p class="visible">The first paragraph is visible.</p> 
 
<p class="not-visible">The second paragraph is NOT visible.</p> 
 

 
<div id="browser"></div> 
 
<div class="LoginField">login fields</div>

来源

2017-09-06 03:58:22

通过浏览器检测来隐藏html表单

回答

相关问题