如何根据Geo ip数组显示或隐藏元素

时间:2015-05-11 19:03:07

标签: javascript jquery html css arrays

您好我想在JS中做一个if语句,如果访问的IP来自欧洲,我想在我的html中说“Hello Europe”。

CSS

CLOCK_MONOTONIC

HTML

#US { text-align: left; color: blue; display:none;} 
#CA { text-align: left; color: blue; display:none;} 
#World { text-align: left; color: blue; display:none;} 
#Europe { text-align: left; color: blue; display:none;} 

JS

<div id="ip">Loading...</div>
<div id="country_code"></div>
<div id="CA">Hello Canada</div>
<div id="US">Hello USA</div>
<div id="World">Hello World</div>
<div id="Europe">Hello Europe</div>

Fiddle

1 个答案:

答案 0 :(得分:1)

一个简单的indexOf应该在这里做得很好。

$.get("http://freegeoip.net/json/", function(response) {
    $("#ip").html("IP: " + response.ip);
    $("#country_code").html(response.country_code);

    var country = response.country_code;
    var europe = ['AL', 'AD', 'AT', 'BY', 'BE', 'BA', 'BG', 'HR', 'CY', 'CZ', 'DK', 'EE', 'FO', 'FI', 'FR', 'DE', 'GI', 'GR', 'HU', 'IS', 'IE', 'IT', 'LV', 'LI', 'LT', 'LU', 'MK', 'MT', 'MD', 'MC', 'NL', 'NO', 'PL', 'PT', 'RO', 'RU', 'SM', 'RS', 'SK', 'SI', 'ES', 'SE', 'CH', 'UA', 'VA', 'RS', 'IM', 'RS', 'ME'];
    var inEU = europe.indexOf(country) !== -1;

    if (country == 'US' || country == 'CA') document.getElementById(country).style.display = "block";
    else if (inEU)
        document.getElementById('Europe').style.display = "block";
    else
        document.getElementById('World').style.display = "block";
}, "jsonp");

链接到文档以供进一步阅读:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf