0

我们在这里有一个移动网页，可在不同国家/地区使用，在每个国家/地区内，我们需要能够根据访问者的 IP 更改以下内容：

  • div#container 拥有不同的背景图像
  • div#buttons 被隐藏和 div#buttons-2 被显示

使用称为GeoIP的 JavaScript ，到目前为止，我们能够识别访问者的国家并以两个字符 ISO 3166-1 的形式获取函数名称，以用于控制其他 JavaScript 函数。例如，我来自英国，所以当我访问该页面时，JavaScript 会生成以下代码：

function geoip_country_code() { return 'GB'; }

在 HTML 中，目前有一个脚本说：

    if (geoip_country_code() == 'GB') 
    {
      alert("Hello, you are in Great Britain");
    }

我们想开发它，以便我们可以操纵指定元素的 CSS，但我们并不精通 JavaScript，所以这就是我们需要帮助的地方。

这是嵌入到页面中的 JavaScript：

<script src="http://j.maxmind.com/app/country.js" charset="ISO-8859-1"></script>

以下是我们要控制的 HTML 元素：

<div id="container">
            <div id="buttons">
                <a href="#" target="blank">
                    <div class="button youtube"></div>
                </a>
                <a href="#" target="blank">
                    <div class="button facebook"></div>
                </a>
                <a href="#" target="blank">
                    <div class="button web"></div>
                </a>
                <a href="#" target="blank">
                    <div class="button appstore"></div>
                </a>
            </div>
        </div>
4

2 回答 2

2 
var map = {
    'GB': {
        'background': 'img1.jpg',
        'buttons': 'show',
        'buttons2': 'hide'
    }
};

var country = geoip_country_code();
$('#container').css('background', map[country].background);
$('#buttons')[map[country].buttons]();
$('#buttons2')[map[country].buttons2]();

这是一个使用 jQuery 的示例。我希望您了解使用“映射对象”（那里只有英国，但可以根据需要添加国家/地区），然后您可以在此基础上执行您的操作。

于 2012-09-04T11:46:57.643 回答
0

根据返回的国家代码，您应该更改样式表（css）

就像如果返回 GB 然后加载 div#container 具有不同背景图像的 css 隐藏 div#buttons 并显示 div#buttons-2

反之亦然。

或者你可以简单地用 javascript 做到这一点

制作一个函数：设置容器的背景图像，隐藏 div#button，显示 div#buttons-2

以及反之亦然的另一个功能，例如：设置容器的另一个背景图像，显示 div#button，隐藏 div#buttons-2

现在你可以调用适当的函数来显示如下：如果返回'US'调用func1，如果返回'UK'调用func2

于 2012-09-04T11:01:04.043 回答