2014-01-04 6 views
1

Я управляю веб-сайтом, на котором я хотел бы рекламировать загружаемую программу только для окон.Показать или скрыть Div на основе ОС

  • Объявление для этого будет находиться внутри div, называемого «adforwindows».
  • Я хотел бы использовать метод обнаружения, похожий на тот, перечисленные здесь: http://www.javascripter.net/faq/operatin.htm

Резюме:

If Operating System = Windows 

Then set visibility of Div 'adforwindows' to visible
Else Set visibility of Div 'adforwindows' to hidden

Кто-нибудь знает хороший HTML/JavaScript сценарий что можно сделать?

EDIT

Является ли это решение? Кажется, не может заставить его работать;

<!DOCTYPE html> 
<html> 
<head> 
<script> 
var OSName="Unknown OS"; 
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; 
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; 
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; 
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; 

if(OSName == "Windows"){ 
    document.getElementById('adforwindows').style.visibility = "visible"; 
} 
else{ 
    document.getElementById('adforwindows').style.visibility = "hidden"; 
} 
</script> 
</head> 
<body> 
<div class="adforwindows"> 
Windows Advert 
</div> 
<p>Main site content<P> 
</body> 
</html> 
+0

посмотреть здесь: http://stackoverflow.com/questions/11219582/how-to-detect-my-browser-version -and-operating-system-using-javascript –

ответ

2

Поскольку вы уже знаете ОС от этого кода (взятый с сайта)

var OSName="Unknown OS"; 
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; 
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; 
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; 
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; 

Таким образом, вы можете использовать простой, если заявление, чтобы проверить и document.getElementById, чтобы установить видимость.

var OSName="Unknown OS"; 
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; 
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; 
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; 
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; 

if(OSName == "Windows"){ 
    document.getElementById('adforwindows').style.display = "block"; 
} 
else{ 
    document.getElementById('adforwindows').style.display = "none"; 
} 


Если вам не нужно знать другие операционные системы, используйте этот сокращенный код:

if (navigator.appVersion.indexOf("Win")!=-1) 
    document.getElementById('adforwindows').style.display = "block"; 
} 
else{ 
    document.getElementById('adforwindows').style.display = "none"; 
} 


EDIT: если вы хотите иметь его visibility:none/visible вместо display:none (есть разница: http://www.w3schools.com/css/css_display_visibility.asp вы можете изменить .style.display = "none"; до .style.visibility = "hidden"; и изменить .style.display = "block"; до .style.visibility = "visible";

+0

Не могу заставить его работать - это правильно? '

Windows Advert
' – JBithell

+0

Да, это выглядит правильно .. Но вы можете поместить скрипт после

. Это связано с тем, что скрипт будет запущен до инициализации div (если вы проверите консоль и увидите ошибку типа «Невозможно получить стиль неопределенного», это ваша проблема). Использование jQuery onready также поможет. – Samleo

0

Вы можете использовать navigator.platform или navigator.appVersion.

Например:

var getOS = function() { 
    var operatingSystems = { 
     'Win': 'Windows', 
     'Mac': 'MacOS', 
     'Linux': 'Linux', 
     'X11': 'UNIX' 
    }; 
    for(var k in operatingSystems) { 
     if(navigator.appVersion.indexOf(k) !== -1) { 
      return operatingSystems[k]; 
     } 
    } 
    return undefined; 
}; 

console.log(getOS()); 

var os = getOS(); 
document.getElementById('adforwindows').style.display = os === 'Windows' 
    ? 'block' 
    : 'none'; 

DEMO

См https://developer.mozilla.org/en-US/docs/Web/API/NavigatorID

Смежные вопросы