﻿/*
    一、装入本javascript脚本的方法
    <head ......>
    ......
    <script type="text/javascript" src="js/GetHzFromPy.js"></script>
    </head>
    
    二、在服务器端生成拼音词头数组 py_array 和 汉字数组 hz_array
    1. 首先生成字符串py_str="\"YZ\",\"QY\",\"QD\" ......"
                     hz_str="\"永州\",\"祁阳\",\"祁东\" ......"
    2. 在每次装入网页时执行
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
               ......
            }
            ......
            Page.ClientScript.RegisterArrayDeclaration("py_array", py_str.ToString());
            Page.ClientScript.RegisterArrayDeclaration("hz_array", hz_str.ToString());
            ...... 
        }
     三、输入文本框调用方法
     ......
     TextBox1.Attributes.Add("autocomplete", "off"); // 禁止保存历史记录
     TextBox1.Attributes.Add("onkeydown", "javascript: if(event.keyCode==13) event.keyCode=9; else GetHzFromPy(TextBox1);");
     ......           
     
*/
<!--
document.write("<style>");
document.write("#__GetHzFromPy{width:87px;height:193px;margin:0;padding:0;}");
document.write("#GetHzFromPyTable{	margin:0;padding:0;border:0px solid #000;}");
document.write("th,td{margin:0;padding:0px}");
document.write("</style>");
document.write("<div id='__GetHzFromPy' style='position:absolute;display:none;background:white'></div>");
document.write("<table cellspacing=\"0\" cellpadding=\"0\" id=\"GetHzFromPyTable\"><thead><tr class=\"top\">"+
    "<th><select id=GetHzFromPysel style='width: 89px; height: 200px;' size='5' onclick=GetHzFromPyvent() onkeydown='if(event.keyCode==13)GetHzFromPyvent();'>"+
    "</select></th></thead><tbody id=\"GetHzFromPybody\"></tbody></table>");
var GetHzFromPyOuter;
var GetHzFromPyInput;
GetHzFromPyOuter=document.getElementById("__GetHzFromPy"); 
var GetHzFromPyTable = document.getElementById("GetHzFromPyTable");
GetHzFromPyOuter.appendChild(GetHzFromPyTable);
function GetHzFromPy(obj)//主函数
{
    GetHzFromPyInput = obj;
    if(event.keyCode==40 || event.keyCode==98)//按↓键使下拉式列表框得到焦点
    {
        if(GetHzFromPyOuter.style.display=="none")return;
        GetHzFromPysel.focus();
        return;
    }
    var keych=String.fromCharCode(event.keyCode).toUpperCase();
    if(keych>='A' && keych <='Z')
    {
        var str=(GetHzFromPyInput.value+keych).toUpperCase();
        GetHzFromPysel.options.length = 0;
        for(var i=0;i<py_array.length;i++)
        {
            var strpy=py_array[i];
            if(strpy.indexOf(str)==0)GetHzFromPysel.add(new Option(hz_array[i]));
        }
        GetHzFromPyOuter.style.top =getAbsoluteHeight(GetHzFromPyInput)+getAbsoluteTop(GetHzFromPyInput);
        GetHzFromPyOuter.style.left =getAbsoluteLeft(GetHzFromPyInput);
        GetHzFromPyOuter.style.display = "block";
    }
}
function getAbsoluteHeight(ob){return ob.offsetHeight;}
function getAbsoluteWidth(ob){return ob.offsetWidth;}
function getAbsoluteLeft(ob)
{
    var s_el=0;
    el=ob;
    while(el)
    {
        s_el=s_el+el.offsetLeft;
        el=el.offsetParent;
    }
    return s_el;
}
function getAbsoluteTop(ob)
{
    var s_el=0;
    el=ob;
    while(el)
    {
        s_el=s_el+el.offsetTop;
        el=el.offsetParent
    }
    return s_el;
}


function close()
{
	GetHzFromPyOuter.style.display = "none"
	GetHzFromPyOuter.style.top = 0;
	GetHzFromPyOuter.style.left = 0;
}

function GetHzFromPyvent(event)
{
    if(window.event.srcElement==GetHzFromPysel)
    {
        var SelId=GetHzFromPysel.selectedIndex;
        if(SelId==-1)GetHzFromPyInput.value="";
        else GetHzFromPyInput.value=GetHzFromPysel[SelId].text;
        GetHzFromPyInput.focus();
    }
    close();
}

document.onclick = GetHzFromPyvent;
//-->
//</script>
