gpt4 book ai didi

javascript - Location.country_code - Fancybox,现在弹出

转载 作者:行者123 更新时间:2023-11-30 00:28:27 24 4
gpt4 key购买 nike

我曾经让一个 fancybox 根据用户访问的国家/地区向他们显示一条消息,如下所示:

<script>
jQuery.ajax({
url: '//freegeoip.net/json/',
type: 'POST',
dataType: 'jsonp',
success: function(location) {
// If the visitor is browsing from United Kingdom.
if (location.country_code === 'GB') {
// Tell him about U.S. store.
jQuery.fancybox.open(jQuery('#messageGB'));
}
}
});
</script>
<div id="messageGB">
<p>You are visiting our U.S. store. </p>
</div>

我在使用 fancybox 放置 cookie 时遇到了一些问题,所以现在我正在使用一个 jquery 弹出窗口,它本身可以正常工作,但是如果我尝试进行基于国家/地区的调用,它就不起作用了……有什么想法吗我做错了吗?

  // If the visitor is browsing from United Kingdom.
if (location.country_code === 'GB') {
// Tell him about U.S. store.
$('#popup_messageGB').popup({
setcookie: true,
cookie_timeout: 0
}
}
});
</script>
<div id="popup_messageGB">
<p>You are visiting our U.S. store. </p>
</div>

最佳答案

轻松跨域 Ajax

跨域ajax请求需要以特定的方式完成,web服务需要支持。而且您使用的地理位置服务确实支持“jsonp”跨域请求……所以您很幸运。

注意添加到查询字符串的回调参数。您的代码缺少回调,这可能是它无法正常工作的原因。

http://freegeoip.net/json/?callback=onGeoLocation

jQuery 文档解释了如何进行 jsonp 调用 jQuery.getJSON()

你的 jQuery 代码看起来像这样:

$.getJSON('http://freegeoip.net/json/?callback=?', function(data) {
// your popup here
});

然而,对于像这样简单的东西并不真正需要 jQuery。您只需要检索访问者的位置一次。这可以通过在普通脚本标记中包含 Web 服务 URL 来完成。加载后,它将使用返回的数据调用您的函数。

更新:回应评论

@RobRob - 只需复制下面的代码,添加您的弹出代码,就大功告成了。

<!doctype html>
<html>
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.getJSON('http://freegeoip.net/json/?callback=?', function(location) {
// insert your popup code here
alert( location.country_name );
});
});
</script>
</body>
</html>

下面的示例演示了执行 jsonp 调用的两种方法。

运行代码片段以显示您所在的国家/地区

<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<button onclick="getLocation()">jQuery.getJSON</button>
<h2 id="country_name"></h2>
JSON:
<xmp id="stdout" style="border:1px gray solid; background-color:aliceblue;"></xmp>
<script type="text/javascript">

// Method 1: plain Javascript jsonp callback

function onGeoLocation( data ) {
document.getElementById('stdout').innerHTML = JSON.stringify(data,null,' ');

document.getElementById('country_name').innerHTML = 'Country: ' + data.country_name;

// add your popup here

};


// Method 2: Using jQuery

function getLocation() {
$.getJSON('http://freegeoip.net/json/?callback=?', function(data) {

alert( 'jQuery.getJSON\n' + JSON.stringify(data, null, ' '));
// your popup here

});

}

</script>
<!-- This script tag required for method 1 -->
<script type="text/javascript" src="http://freegeoip.net/json/?callback=onGeoLocation"></script>
</body>
</html>

关于javascript - Location.country_code - Fancybox,现在弹出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30551800/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com