function showArea() {
    $("#addr").remove();
    var iptName = "IQSB1_MXJobSrchCriteria_City1";
    var iptOffSet = $(this).offset();
    var iptLeft = iptOffSet.left - 160;
    var iptTop = iptOffSet.top + 20;

    var str = "<div id='addr'><div id='popTop'><a id='close'>[&nbsp;关闭&nbsp;]</a>请选择工作地点</div><b>主要城市</b><ul id='city'></ul><div style='clear:both; height:10px;'></div><b>所有省份</b> <a id='fh'>[返回到所有省份]</a><ul id='province'></ul><div style='clear:both;'></div></div>";

    //main city
    mainCityLenth = mainCityArr.length;
    var strCity = "";
    for (var i = 0; i < mainCityLenth; i++) {
        strCity = strCity + "<li id='p" + mainCityArr[i][0] + "'>" + mainCityArr[i][1] + "</li>";
    }
    //all province
    provinceLenth = provinceArr.length;
    var strProvince = "";
    for (var i = 0; i < provinceLenth; i++) {
        strProvince = strProvince + "<li id='p" + provinceArr[i][0] + "'>" + provinceArr[i][1] + "</li>";
    }

    $("body").append(str);
    $("#addr").css({ left: iptLeft + "px", top: iptTop + "px" });
    $("#addr ul#city").append(strCity); $("#addr ul#province").append(strProvince);
    //cityClick
    $("#addr ul#city li").bind("click", { iptn: iptName }, liBind);
    //provinceClick    
    $("#addr ul#province li").bind("click", { iptn: iptName }, liBind2);
    //close
    $("#addr div a#close").bind("click", function() {
        $("#addr").remove();
    });

    //back to province
    $("#addr a#fh").bind("click", function() {
        $("#addr ul#province").empty();
        $("#addr ul#province").append(strProvince);
        $("#addr ul#province li").bind("click", { iptn: iptName }, liBind2);
    });
}
function liBind2(event) {
    var setipt = event.data.iptn;
    var liId = $(this).attr("id");
    var liText = $(this).text();
    var pArr = eval(liId);
    pLen = pArr.length;

    listr = "";
    for (j = 0; j < pLen; j++) {
        listr = listr + "<li id='c" + pArr[j][0] + "'>" + pArr[j][1] + "</li>";
        //add tally to count clicks
        CB.Tally(pArr[j][0], "Campus.aspx", "Location click count");

    }

    $("#addr ul#province").empty();
    $("#addr ul#province").append(listr);
    $("#addr ul#province li").bind("click", { ipt2: setipt }, setVal);

    $("#c" + liId.substring(1, 5)).text("");
    $("#c" + liId.substring(1, 5)).append("<b style='color:#FF8C00'>" + liText + "</b>");
}

function liBind(event) {
    var setipt = event.data.iptn;
    var liId = $(this).attr("id");
    var liText = $(this).text();
    $("#" + setipt + "Val").val(liId.substring(1, 5));
    $("#" + setipt).val(liText);
    $("#addr").css("display", "none");
    //add tally to count clicks
    CB.Tally(liId.substring(1, 5), "Campus.aspx", "Location click count");

}
function setVal(event) {
    var setipt2 = event.data.ipt2;
    var iptText = $(this).text();
    var iptVal = $(this).attr("id");
    $("#" + setipt2 + "Val").val(iptVal.substring(1, 5));
    $("#" + setipt2).val(iptText);
    $("#addr").css("display", "none");
}