我的表单中有一个文本框,我想根据我使用的浏览器类型(例如 firefox)调整其宽度。我有一个 JQuery 代码,可以检测我正在使用的浏览器,并减少 CSS文本框的宽度,但是我如何一起使用它来完成我想要的事情,或者是否有更简单的方法来根据浏览器调整文本框的大小?
JQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+ "[object HTMLElementConstructor]"
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0 || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;
jQuery(function($)
{
if(isChrome) {
console.log("Using Chrome");
}
else if(isFirefox) {
//$("#DOB").mask("99/99/9999",{placeholder:" "});
console.log("Using FireFox");
}
});
</script>
CSS
#DOB
{
width:100%;
max-width: 172px
}
最佳答案
您可以根据浏览器向正文标记添加类,并根据它们添加样式。例如:
<script>
jQuery(function($)
{
if (isChrome) {
$('body').addClass('browser-chrome');
} else if(isFirefox) {
$('body').addClass('browser-firefox');
}
});
</script>
<style>
.browser-chrome #DOB {
width: 100%;
}
.browser-firefox #DOB {
width: 80%;
}
</style>
关于javascript - 根据浏览器类型调整文本框大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41247855/