var oPopup = window.createPopup();
var tr01_01 = "WHITE"; //第一行背景颜色
var tr01_02 = "#FFFFFF"; //第一一行背景颜色，边框
var tr01_03 = "#FFFFFF"; //单元格背景颜色
var tab01 = "#A1BBD0"; //边框颜色
var kongj;
var kongjh;
var style1 = 'style="font-weight: bold;color: #000000;height: 25px;font-size: 9pt;"';
var style2 = 'style=" BACKGROUND-COLOR: #dddddd; color: #333333;background-repeat:repeat-x; background-position:bottom; font-size: 9pt;"';
var style3 = 'style="position: relative; left: 0px; top: 0px; width: 100%;overflow:hidden; text-overflow:ellipsis;font-size: 12px;"';

//北京|PEK|B 城市|三字代码|拼音首字母
var shcs = new Array("北京|PEK|B", "上海|SHA|SH", "广州|CAN|G", "成都|CTU|C", "厦门|XMN|X", "西安|XIY|X", "杭州|HGH|H", "重庆|CKG|C", "昆明|KMG|K", "贵阳|KWE|G", "武汉|WUH|W", "天津|TSN|T", "太原|TYN|T", "呼和浩特|HET|H", "沈阳|SHE|S", "长春|CGQ|C", "哈尔滨|HRB|H", "南京|NKG|N", "合肥|HFE|H", "福州|FOC|F", "南昌|KHN|N", "济南|TNA|J", "郑州|CGO|Z", "长沙|CSX|C", "南宁|NNG|N", "海口|HAK|H", "兰州|LHW|L", "银川|INC|Y", "西宁|XNN|X", "乌鲁木齐|URC|W", "石家庄|SJW|S", "拉萨|LXA|L");
var qtcs = new Array("鞍山|AOG|A", "安阳|AYN|A", "包头|BAV|B", "北海|BHY|B", "北京|PEK|B", "长安|CAL|C", "长春|CGQ|C", "常德|CGD|C", "长沙|CSX|C", "常州|CZX|C", "朝阳|CHG|C", "潮州|CCC|C", "济州|CJU|C", "成都|CTU|C", "赤峰|CIF|C", "重庆|CKG|C", "大理|DLU|D", "大连|DLC|D", "大同|DAT|D", "达县|DAX|D", "迪庆香格里拉|DIG|D", "东胜|DSN|D", "敦煌|DNH|D", "恩施|ENH|E", "佛山|FUO|F", "阜阳|FOG|F", "福州|FOC|F", "赣州|KOW|G", "高雄|KHH|G", "广汉|GHN|G", "广元|GNY|G", "广州|CAN|G", "桂林|KWL|G", "贵阳|KWE|G", "海口|HAK|H", "海拉尔|HLD|H", "海南|HKK|H", "杭州|HGH|H", "汉中|HZG|H", "哈尔滨|HRB|H", "合肥|HFE|H", "黑河|HEK|H", "衡阳|HNY|H", "呼和浩特|HET|H", "香港|HKG|H", "长沙/黄花|HHA|H", "黄山|TXN|H", "黄岩|HYN|H", "徽州|HUZ|H", "佳木斯|JMU|J", "吉安|KNC|J", "嘉峪关|JGN|J", "吉林|JIL|J", "济南|TNA|J", "景德镇|JDZ|J", "济宁|JNG|J", "泉州晋江|JJN|J", "锦州|JNZ|J", "酒泉|CHW|J", "喀什|KHG|K", "昆明|KMG|K", "兰州|LHW|L", "兰州东|LZD|L", "拉萨|LXA|L", "连云港|LYG|L", "丽江|LJG|L", "临沧|LNC|L", "林西|LXI|L", "临沂|LYI|L", "柳州|LZH|L", "洛阳|LYA|L", "庐山|LUZ|L", "泸州|LZO|L", "澳门|MFM|M", "梅县|MXZ|M", "绵阳|MIG|M", "牡丹江|MDG|M", "南昌|KHN|N", "南充|NAO|N", "南京|NKG|N", "南宁|NNG|N", "南通|NTG|N", "南阳|NNY|N", "宁波|NGB|N", "青岛|TAO|Q", "秦皇岛|SHP|Q", "庆阳|IQN|Q", "齐齐哈尔|NDG|Q", "衢州|JUZ|Q", "三亚|SYX|S", "仙台|SDJ|S", "上海|SHA|SH", "上海虹桥|SHA|S", "上海浦东|PVG|S", "鄯善|SXJ|S", "汕头|SWA|S", "沙市|SHS|S", "沈阳|SHE|S", "深圳|SZX|S", "石家庄|SJW|S", "四川|SCH|S", "思茅|SYM|S", "苏州|SZV|S", "台北|TPE|T", "台东|TTT|T", "台南|TNN|T", "太原|TYN|T", "台中|TXG|T", "天津|TSN|T", "通化|TNH|T", "通辽|TGO|T", "铜仁|TON|T", "富山|TOY|T", "乌鲁木齐|URC|U", "万州|WXN|W", "潍坊|WEF|W", "威海|WEH|W", "温州|WNZ|W", "武汉|WUH|W", "芜湖|WHU|W", "吴锡|WUX|W", "武夷山|WUS|W", "梧州|WUZ|W", "厦门|XMN|X", "西安|SIA|X", "襄樊|XFN|X", "西安咸阳机场|XIY|X", "西昌|XIC|X", "锡林浩特|XIL|X", "兴城|XEN|X", "兴宁|XIN|X", "邢台|XNT|X", "西宁|XNN|X", "西双版纳|JHG|X", "徐州|XUZ|X", "延安|ENY|Y", "盐城|YNZ|Y", "延吉|YNJ|Y", "烟台|YNT|Y", "宜宾|YBP|Y", "宜昌|YIH|Y", "铱兰|YLN|Y", "银川|INC|Y", "伊宁|YIN|Y", "义乌|YIW|Y", "永州|YON|Y", "榆林|UYN|Y", "张家界|DYG|Z", "湛江|ZHA|Z", "昭通|ZAT|Z", "郑州|CGO|Z", "中甸|ZHD|Z", "舟山|HSN|Z", "珠海|ZUH|Z", "遵义|ZYI|Z");
var ywzm = new Array("A", "B", "C", "D", "E", "F", "G", "H", "J", "K", "L", "M", "N", "Q", "S", "T", "W", "X", "Y", "Z")
var popup_gd = 25; //数据显示高度
var popup_i;
var popup_int0 = 0;
var popup_int1 = 0;
var popup_int2 = 0;
var popup_int3 = 0;


function Split(popup_str, popup_n, popup_s) { //字符串,取第几个数据,分割字符
    var popup_split = popup_str.split(popup_s);
    return popup_split[popup_n];
}

function popUp(abc, def) {
    if (typeof (abc) == 'string')
        kongj = document.all(abc);
    else
        kongj = abc;
    if (typeof (def) == 'string')
        kongjh = document.all(def);
    else
        kongjh = def;

    var posLib = {
        getClientLeft: function(el) {
            var r = el.getBoundingClientRect();
            return r.left - this.getBorderLeftWidth(this.getCanvasElement(el));
        },

        getClientTop: function(el) {
            var r = el.getBoundingClientRect();
            return r.top - this.getBorderTopWidth(this.getCanvasElement(el));
        },

        getLeft: function(el) {
            return this.getClientLeft(el) + this.getCanvasElement(el).scrollLeft;
        },

        getTop: function(el) {
            return this.getClientTop(el) + this.getCanvasElement(el).scrollTop;
        },

        getInnerLeft: function(el) {
            return this.getLeft(el) + this.getBorderLeftWidth(el);
        },

        getInnerTop: function(el) {
            return this.getTop(el) + this.getBorderTopWidth(el);
        },


        getWidth: function(el) {
            return el.offsetWidth;
        },

        getHeight: function(el) {
            return el.offsetHeight;
        },

        getCanvasElement: function(el) {
            var doc = el.ownerDocument || el.document;    // IE55 bug
            if (doc.compatMode == "CSS1Compat")
                return doc.documentElement;
            else
                return doc.body;
        },

        getBorderLeftWidth: function(el) {
            return el.clientLeft;
        },

        getBorderTopWidth: function(el) {
            return el.clientTop;
        },

        getScreenLeft: function(el) {
            var doc = el.ownerDocument || el.document;    // IE55 bug
            var w = doc.parentWindow;
            return w.screenLeft + this.getBorderLeftWidth(this.getCanvasElement(el)) + this.getClientLeft(el);
        },

        getScreenTop: function(el) {
            var doc = el.ownerDocument || el.document;    // IE55 bug
            var w = doc.parentWindow;
            return w.screenTop + this.getClientTop(el); //+ this.getBorderTopWidth(this.getCanvasElement(el))
        }
    }

    popup_int0 = 0;
    popup_int1 = 0;
    popup_int2 = 0;
    popup_int3 = 0;
    var tab;
    tab = '<table width="300" border="0" cellpadding="0" cellspacing="1" bgcolor="' + tab01 + '">';
    tab += '<tr>';
    tab += '<td>';
    tab += '<table width="100%" border="0" cellpadding="0" cellspacing="0" style="background-color:' + tr01_02 + ';">';
    //tab+= ' <tr align="center">';
    //tab+= '    <td height="23"'+style1+'>请您选择城市</td>';
    //tab+= ' </tr>';
    tab += ' <tr align="center">';
    tab += '    <td height="23"' + style2 + '>';
    tab += '      <table width="100%" align="center" border="0" cellspacing="0" cellpadding="0" style="font-size: 9pt"><tr><td width="100" style="padding-left:10px;" >城市拼音首字母：</td><td><table width="100%" border="0" cellpadding="0" cellspacing="0" style="font-size: 10pt"><tr align="center">';
    for (var ywzm_i = 0; ywzm_i < 26; ywzm_i++) {
        if (!ywzm[ywzm_i]) break;
        tab += '<td id=H_"' + ywzm[ywzm_i] + '"><label id="' + ywzm[ywzm_i] + '" style="color:#0000FF; cursor:hand" title="点击查看城市首字母为 ' + ywzm[ywzm_i] + ' 的城市">' + ywzm[ywzm_i] + '</label></td>';
    }
    tab += '        <td id="H_SH"><label id="SH" style="color:#FF0000; cursor:hand" title="点击查看省会城市">SH</label></td>';
    tab += '      </tr></table></td></tr></table>';
    tab += '    </td>';
    tab += ' </tr>';
    tab += ' <tr align="center">';
    tab += '   <td id="Popup_Tab">';
    tab += '    <table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size: 9pt">';

    for (popup_i = 0; popup_i < 36; popup_i++) {
        if (popup_i == 0 || popup_i % 6 == 0) {
            tab += ' <tr align="center" style="background-color:' + tr01_03 + ';">';
        }
        if (shcs[popup_i]) {
            tab += '    <td height="' + popup_gd + '" width="14.3%" ID="popup_td_cszm_' + popup_int0 + '" title="' + Split(shcs[popup_i], 0, "|") + '" style="font-size: 9pt"><NOBR ' + style3 + ' ID="popup_NOBR_cszm_' + Split(shcs[popup_i], 1, "|") + '_' + popup_int0 + '">' + Split(shcs[popup_i], 0, "|") + '</NOBR></td>';
            popup_int0++;
        }
        else {
            tab += '    <td height="' + popup_gd + '" width="14.3%">&nbsp;</td>';
        }
        popup_int3 = popup_i + 1;
        if (popup_int3 % 6 == 0) {
            tab += ' </tr>';
        }
    }

    tab += '    </table>';
    tab += '   </td>';
    tab += ' </tr>';
    tab += '</table>';
    tab += '</td>';
    tab += '</tr>';
    tab += '</table>';

    var newX = posLib.getClientLeft(kongj) + posLib.getCanvasElement(kongj).clientLeft;
    var newY = posLib.getClientTop(kongj) + kongj.offsetHeight + posLib.getCanvasElement(kongj).clientTop;
    oPopup.document.body.innerHTML = tab;
    oPopup.document.body.onclick = Htc_OnClick;
    oPopup.document.body.onmousemove = Htc_onmousemove;
    oPopup.show(newX, newY, 300, 175, document.body);
}

function Htc_OnClick() { //鼠标点击事件
    var Htc_str;
    var obj = this.document.parentWindow;
    var e = obj.event.srcElement;
    if (e.tagName == "LABEL") {
        if (e.id != "") {
            yc_dt(e.id);
        }
    }
    if (e.tagName == "NOBR") {
        //f_z(Split(e.id,3,"_"));
        f_z(oPopup.document.all(e.id).innerHTML);
        oPopup.hide();
    }

    if (e.tagName == "TD") {//H_
        if (e.id != "") {
            yc_dt(Split(e.id, 1, "_"));
        }
    }
}

var ll = "popup_td_cszm_0";
function Htc_onmousemove() {   //鼠标移动事件
    var obj = this.document.parentWindow;
    var e = obj.event.srcElement;
    if (e.tagName == "TD") {
        if (e.id != "") { turnrowcolor(e.id, ll); }
    }
    if (e.tagName == "NOBR") {
        if (e.id != "") { turnrowcolor("popup_td_cszm_" + Split(e.id, 4, "_"), ll); }
    }
}

function turnrowcolor(ss, ls) {   //鼠标移动TD背景颜色
    var bc = "#A1BBD0";
    if (oPopup.document.all(ls)) oPopup.document.all(ls).style.backgroundColor = "";
    if (oPopup.document.all(ss)) oPopup.document.all(ss).style.backgroundColor = bc;
    if (oPopup.document.all(ss)) oPopup.document.all(ss).style.cursor = "hand";
    ll = ss;
}

//var yc_dt_cs="SH";
function yc_dt(int) {
    int = int.replace("\"", "").replace("\"", "");
    //alert(int);
    var yc_dt_cs = "SH";
    for (var k = 0; k < 26; k++) {
        if (!ywzm[k]) break;
        oPopup.document.all(ywzm[k]).style.color = "#0000FF";
    }
    if (int != yc_dt_cs) {
        oPopup.document.all(yc_dt_cs).style.color = "#0000FF";
        oPopup.document.all(int).style.color = "#FF0000";
        yc_dt_cs = int;
        Popup_tab(int, 0);
    } else {
        oPopup.document.all(int).style.color = "#FF0000";
        Popup_tab(int, 1);
    }
}

function Popup_tab(str, lx) { //生成数据
    var Popup_dat_i = 0;
    var Popup_dat_n;
    var Popup_dat_tab = "";
    var Popup_dat = new Array()
    if (lx == 0) {
        for (Popup_dat_n = 0; Popup_dat_n < qtcs.length; Popup_dat_n++) {
            if (Split(qtcs[Popup_dat_n], 2, "|") == str) {
                Popup_dat[Popup_dat_i++] = qtcs[Popup_dat_n];
            }
        }
    } else {
        Popup_dat = shcs;
    }
    popup_int0 = 0;

    Popup_dat_tab += '<table width="100%" border="0" cellspacing="1" cellpadding="0" style="font-size: 9pt">';
    for (Popup_dat_n = 0; Popup_dat_n < 36; Popup_dat_n++) {
        if (Popup_dat_n == 0 || Popup_dat_n % 6 == 0) {
            Popup_dat_tab += ' <tr align="center" style="background-color:' + tr01_03 + ';">';
        }
        if (Popup_dat[Popup_dat_n]) {
            Popup_dat_tab += '    <td height="' + popup_gd + '" width="14.3%" ID="popup_td_cszm_' + popup_int0 + '" title="' + Split(Popup_dat[Popup_dat_n], 0, "|") + '" style="font-size: 9pt"><NOBR ' + style3 + ' ID="popup_NOBR_cszm_' + Split(Popup_dat[Popup_dat_n], 1, "|") + '_' + popup_int0 + '">' + Split(Popup_dat[Popup_dat_n], 0, "|") + '</NOBR></td>';
            popup_int0++;
        } else {
            Popup_dat_tab += '    <td height="' + popup_gd + '" width="14.3%">&nbsp;</td>';
        }
        popup_int3 = Popup_dat_n + 1;
        if (popup_int3 % 6 == 0) {
            Popup_dat_tab += ' </tr>';
        }
    }
    Popup_dat_tab += '    </table>';
    oPopup.document.all("Popup_Tab").innerHTML = Popup_dat_tab;
}

function f_z(temp) {   //赋值给控件
    setCodevalue(temp);
    kongj.value = temp;
}


function setCodevalue(temp) {
    var length = qtcs.length;
    for (i = 0; i < length; i++) {
        var tempArray = qtcs[i].split("|");
        if (tempArray[0] == temp) {
            //    kongj.codevalue=tempArray[1];
            //    kongjh.value=tempArray[1]+tempArray[0];
            kongjh.value = tempArray[1];
            break;
        }
    }
}