Snippets

Risent Zhang 根据访客地理位置弹出重定向浮层

Created by Risent Zhang
$(function() {
    // **功能说明**
    // 根据SITES_TABLE 中的城市网站对应关系,当访问主网站的用户所在的城市有对应的分站存在,
    // 则弹出一个浮动窗口,浮动窗口中的 “点击进入” 按钮的链接是对应的分站的链接,如果用户这
    // 时候不点击 “点击进入” 而是选择返回主站,则在cookie中记住该用户的选择,并且在一天之
    // 内不再弹出该选择窗口。
    // 
    // **注意事项**:
    // 请在页面中加载jQuery.cookie
    // http://s2.d2scdn.com/static/store/js/jquery.cookie.js


    // 网站与城市之间的对应关系
    var SITES_TABLE = {
        '上海': 'http://www.looking-car.com',
        '长沙': 'http://www.looooking-car.ocm',
        '深圳': 'http://www.gzlooking-car.com',
        '南京': 'http://www.njlooking-car.com'
    };

    // 浮动层对应的DOM元素
    var $overlay = $(); 

    // 浮动层中的重定向按钮
    var $redirectBtn = $();

    // 浮动层中不前往分站,直接返回主站的按钮
    var $cancelBtn = $();

    // 浮动层是否被禁止,当客户第一次打开后选择关闭浮动层,即不进入分站,而是进入主站,
    // 则在主站中的页面中继续浏览的过程中不再弹出浮动层。
    var overlayDisabled = $.cookie('overlayDisabled') || false;

    if (!overlayDisabled) {
        $.ajax({
            url: 'http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=jsonp',
            jsonp: 'callback',
            dataType: 'jsonp',
            success: function(data) {
                console.log('hello');
            },
            error: function(data) {
                // JSONP调用成功后当前用户的IP地理位置信息被存储到 remote_ip_info 中
                console.log(remote_ip_info);
                var city = remote_ip_info.city; 
                if (SITES_TABLE[city] != undefined) {
                    // 设置 请点击 按钮的网址
                    $redirectBtn.attr('href', SITES_TABLE[city]);

                    // 弹出浮动层窗口
                    if (!overlayDisabled) {
                        $overlay.show();
                    }
                }
            }
        });
    }


    $cancelBtn.click(function(event) {
        // 在cookie中记住用户的选择,1天之内不再弹出浮动层,测试过程中如果需要继续弹出请清除浏览器中的cookie
        $.cookie('overlayDisabled', true, {expires: 1, path: '/', domain: 'looking-car.com', secure: true});
    })
})

Comments (0)

HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.