ユーザーがIEとFirefoxを使用しているかどうかを検出したいのですが、スクリプトが見つかりません。
私は次のようなコードを持っています:
$(document).ready(function(e) {
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
if($.browser.chrome){
alert(1);
//this work well
}
else if(//the browser is IE){alert(2);}
else if(//the browser is Firefox){alert(3);}
//The problem is that I don't know how to write a script for IE and FireFox browser for chrome is work fine
)};
おそらく最善の解決策は、Modernizrを使用することです。
ただし、$。browserプロパティを使用する必要がある場合は、 jQuery Migrate plugin(JQuery> = 1.9の場合-以前のバージョンでは使用できます)を使用して、次のような操作を実行できます。
if($.browser.chrome) {
alert(1);
} else if ($.browser.mozilla) {
alert(2);
} else if ($.browser.msie) {
alert(3);
}
何らかの理由でnavigator.userAgentを使用する必要がある場合、次のようになります。
$.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());
$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());
ie検出のための私のソリューション:
if (navigator.userAgent.match(/msie/i) || navigator.userAgent.match(/trident/i) ){
$("html").addClass("ie");
}
Jqueryが必要です。
独自のブラウザ検出コードを書くべきではありません-それは何度も行われています。代わりに Modernizr を使用して、独立したブラウザ機能を検出します。さまざまなブラウザがさまざまな機能のセットをサポートし、それらの機能は同じブラウザのさまざまなバージョンで変更される可能性があるため、ブラウザ全体を検出するよりもさまざまな機能を検出する方が適切です。特定の機能の存在を検出すると、より多くのブラウザでコードがより適切に機能するようになります。これは、さまざまなモバイルブラウザに特に当てはまります。
Modernizrを実行すると、HEAD
要素のclass
属性が更新され、使用しているブラウザーのさまざまな機能がリストされます。その後、Javascriptを使用して属性を照会し、機能が存在する(または存在しない)場合の対処方法を決定します。
これを使って:
(function (factory) {
if (typeof define === 'function' && define.AMD) {
// AMD. Register as an anonymous module.
define(['jquery'], function ($) {
return factory($);
});
} else if (typeof module === 'object' && typeof module.exports === 'object') {
// Node-like environment
module.exports = factory(require('jquery'));
} else {
// Browser globals
factory(window.jQuery);
}
}(function(jQuery) {
"use strict";
function uaMatch( ua ) {
// If an UA is not provided, default to the current browser UA.
if ( ua === undefined ) {
ua = window.navigator.userAgent;
}
ua = ua.toLowerCase();
var match = /(Edge)\/([\w.]+)/.exec( ua ) ||
/(opr)[\/]([\w.]+)/.exec( ua ) ||
/(chrome)[ \/]([\w.]+)/.exec( ua ) ||
/(version)(applewebkit)[ \/]([\w.]+).*(safari)[ \/]([\w.]+)/.exec( ua ) ||
/(webkit)[ \/]([\w.]+).*(version)[ \/]([\w.]+).*(safari)[ \/]([\w.]+)/.exec( ua ) ||
/(webkit)[ \/]([\w.]+)/.exec( ua ) ||
/(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
/(msie) ([\w.]+)/.exec( ua ) ||
ua.indexOf("trident") >= 0 && /(rv)(?::| )([\w.]+)/.exec( ua ) ||
ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) ||
[];
var platform_match = /(ipad)/.exec( ua ) ||
/(iPod)/.exec( ua ) ||
/(iphone)/.exec( ua ) ||
/(Kindle)/.exec( ua ) ||
/(silk)/.exec( ua ) ||
/(Android)/.exec( ua ) ||
/(windows phone)/.exec( ua ) ||
/(win)/.exec( ua ) ||
/(mac)/.exec( ua ) ||
/(linux)/.exec( ua ) ||
/(cros)/.exec( ua ) ||
/(playbook)/.exec( ua ) ||
/(bb)/.exec( ua ) ||
/(blackberry)/.exec( ua ) ||
[];
var browser = {},
matched = {
browser: match[ 5 ] || match[ 3 ] || match[ 1 ] || "",
version: match[ 2 ] || match[ 4 ] || "0",
versionNumber: match[ 4 ] || match[ 2 ] || "0",
platform: platform_match[ 0 ] || ""
};
if ( matched.browser ) {
browser[ matched.browser ] = true;
browser.version = matched.version;
browser.versionNumber = parseInt(matched.versionNumber, 10);
}
if ( matched.platform ) {
browser[ matched.platform ] = true;
}
// These are all considered mobile platforms, meaning they run a mobile browser
if ( browser.Android || browser.bb || browser.blackberry || browser.ipad || browser.iphone ||
browser.iPod || browser.Kindle || browser.playbook || browser.silk || browser[ "windows phone" ]) {
browser.mobile = true;
}
// These are all considered desktop platforms, meaning they run a desktop browser
if ( browser.cros || browser.mac || browser.linux || browser.win ) {
browser.desktop = true;
}
// Chrome, Opera 15+ and Safari are webkit based browsers
if ( browser.chrome || browser.opr || browser.safari ) {
browser.webkit = true;
}
// IE11 has a new token so we will assign it msie to avoid breaking changes
// IE12 disguises itself as Chrome, but adds a new Edge token.
if ( browser.rv || browser.Edge ) {
var ie = "msie";
matched.browser = ie;
browser[ie] = true;
}
// Blackberry browsers are marked as Safari on BlackBerry
if ( browser.safari && browser.blackberry ) {
var blackberry = "blackberry";
matched.browser = blackberry;
browser[blackberry] = true;
}
// Playbook browsers are marked as Safari on Playbook
if ( browser.safari && browser.playbook ) {
var playbook = "playbook";
matched.browser = playbook;
browser[playbook] = true;
}
// BB10 is a newer OS version of BlackBerry
if ( browser.bb ) {
var bb = "blackberry";
matched.browser = bb;
browser[bb] = true;
}
// Opera 15+ are identified as opr
if ( browser.opr ) {
var opera = "opera";
matched.browser = opera;
browser[opera] = true;
}
// Stock Android browsers are marked as Safari on Android.
if ( browser.safari && browser.Android ) {
var Android = "Android";
matched.browser = Android;
browser[Android] = true;
}
// Kindle browsers are marked as Safari on Kindle
if ( browser.safari && browser.Kindle ) {
var Kindle = "Kindle";
matched.browser = Kindle;
browser[Kindle] = true;
}
// Kindle Silk browsers are marked as Safari on Kindle
if ( browser.safari && browser.silk ) {
var silk = "silk";
matched.browser = silk;
browser[silk] = true;
}
// Assign the name and platform variable
browser.name = matched.browser;
browser.platform = matched.platform;
return browser;
}
// Run the matching process, also assign the function to the returned object
// for manual, jQuery-free use if desired
window.jQBrowser = uaMatch( window.navigator.userAgent );
window.jQBrowser.uaMatch = uaMatch;
// Only assign to jQuery.browser if jQuery is loaded
if ( jQuery ) {
jQuery.browser = window.jQBrowser;
}
return window.jQBrowser;
}));
それを使用してみてください
$(document).ready(function() {
// If the browser type if Mozilla Firefox
if ($.browser.mozilla && $.browser.version >= "1.8" ){
// some code
}
// If the browser type is Opera
if( $.browser.opera)
{
// some code
}
// If the web browser type is Safari
if( $.browser.safari )
{
// some code
}
// If the web browser type is Chrome
if( $.browser.chrome)
{
// some code
}
// If the web browser type is Internet Explorer
if ($.browser.msie && $.browser.version <= 6 )
{
// some code
}
//If the web browser type is Internet Explorer 6 and above
if ($.browser.msie && $.browser.version > 6)
{
// some code
}
});
このコードを使用して正しいブラウザを見つけ、ターゲットブラウザに変更を加えることができます。
function myFunction() {
if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ){
alert('Opera');
}
else if(navigator.userAgent.indexOf("Chrome") != -1 ){
alert('Chrome');
}
else if(navigator.userAgent.indexOf("Safari") != -1){
alert('Safari');
}
else if(navigator.userAgent.indexOf("Firefox") != -1 ){
alert('Firefox');
}
else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )){
alert('IE');
}
else{
alert('unknown');
}
}
<!DOCTYPE html>
<html>
<head>
<title>Browser detector</title>
</head>
<body onload="myFunction()">
// your code here
</body>
</html>
ここでブラウザの種類を取得できます:
<script>
var browser_type = Object.keys($.browser)[0];
alert(browser_type);
</script>
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
if($.browser.chrome){
alert(1);
}
UPDATE:(10x to @Mr。Bacciagalupe)
jQueryは$.browser
を1.9とその最新リリースから削除しました。
しかし、スタンドアロンプラグインとして$ .browserを使用できます。 here
IEのバージョンを見つける別の方法
http://tanalin.com/en/articles/ie-version-js/
IEバージョン確認する条件
IE 10 or older - document.all <BR/>
IE 9 or older - document.all && !window.atob <br/>
IE 8 or older - document.all && !document.addEventListener <br/>
IE 7 or older - document.all && !document.querySelector <br/>
IE 6 or older - document.all && !window.XMLHttpRequest <br/>
IE 5.x - document.all && !document.compatMode
$(document).ready(function(){
alert('sdfsd');
checkOperatingSystem();
});
function checkOperatingSystem(){
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
if (/Android/i.test(userAgent)) {
alert('Android');
}
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
alert('ios');
}
if (navigator.appVersion.indexOf("Win")!=-1)
{
}
if (navigator.appVersion.indexOf("Mac")!=-1)
{
}
}