var child_create = false;
var child_id = 0;
var div_name = '';
var navigator_agent  =  (navigator.appVersion.indexOf("MSIE") != -1) ? "IE":(navigator.userAgent.indexOf("Firefox") != -1) ? "FIREFox":"OPERA";//Navigate type
function off_set(e)
//取标签的绝对位置
{
	var t = e.offsetTop + 2;
	var l = e.offsetLeft + 2;
	var w = e.offsetWidth + 2;
	var h = e.offsetHeight;
	while(e = e.offsetParent)
	{
		if(navigator_agent  ==  "IE")
		{
			t += e.offsetTop;
		}
		else
		{
			t += e.offsetTop - 2;
		}
		l += e.offsetLeft;
	}
	return {
		top : t,
		left : l,
		width : w,
		height : h
	}
}
function load_select(ele, is_reload)
{
	if(typeof is_reload == 'undefined')
	{
		is_reload = false;
	}
	var obj = document.getElementsByTagName('select');
	var len = (obj.length);
	for(var i =0; i < len; i++)
	{
		if(obj[i].className == ele)
		{
			reload_select(obj[i], is_reload);
		}
	}
}
function hide_select()
{
    if(document.getElementById(div_name))
    {
        if(document.getElementById(div_name).style.display != 'none' && document.getElementById(div_name).style.display != "")
        {
            document.getElementById(div_name).style.display = 'none';
            
            document.onclick = function(event){}
        }
        else
        {
            document.getElementById(div_name).style.display = 'block';
        }
    }
}
function reload_select(obj, is_reload)
{
	if(typeof is_reload == 'undefined')
	{
		is_reload = false;
	}
    if(obj.id == 'undefined' || obj.id == '' || obj.id == null)
    {
        obj.id = '_select_' + child_id;
        child_id++;
    }
	//第一步：取得Select所在的位置
	var offset = off_set(obj.parentNode);
	//第二步：将真的select隐藏
	obj.style.display = "none";
	if(navigator_agent  ==  "IE")
	{
		over_top  =  -2;
	}
	else
	{
		over_top  =  0;
	}
	over_width  =  17;
	if(is_reload)
	{
		if(document.getElementById("selectof" + obj.id))
		{
			document.body.removeChild(document.getElementById("selectof" + obj.id));
		}
	}
	//第三步：虚拟一个div出来代替select
	var i_div  =  document.createElement("div");
	i_div.id = "selectof" + obj.id;
	i_div.style.textAlign  =  "left";
	i_div.style.position  =  "absolute";
	i_div.style.cursor  =  "pointer";
	i_div.style.paddingLeft  =  "3px";
    if(parseInt(offset.width) > 0)
    {
	    i_div.style.width = (parseInt(offset.width) + over_width) + "px";
    }
    if(parseInt(offset.height) > 0)
    {
	    i_div.style.height = (parseInt(offset.height) - 2) + "px";
    }
	i_div.style.top = offset.top + "px";
	i_div.style.left = offset.left + "px";
	//i_div.style.background = "url(images/users/page_bg_right.gif) no-repeat right 0px";
	//i_div.style.border = "1px solid #3366ff";
	i_div.style.fontSize = "12px";
    if(parseInt(offset.height) > 0)
    {
	    i_div.style.lineHeight = offset.height - 2 + "px";
    }
	i_div.style.color  =  "#000";
	i_div.style.textIndent = "4px";
	document.body.appendChild(i_div);
	//第四步：将select中默认的选项显示出来
    var tValue = '';
    if(obj.options.length > 0)
    {
	    tValue = obj.options[obj.selectedIndex].text;
    }
	i_div.innerHTML = tValue;
	//第五步：模拟鼠标点击
	i_div.onmouseover = function()
	{//鼠标移到
		//i_div.style.background = "url(images/users/page_bg_right.gif) no-repeat right 0px";
	}
	i_div.onmouseout = function()
	{//鼠标移走
	}
    i_div.hidden = function()
    {
        if(document.getElementById(div_name))
        {
            if(document.getElementById(div_name).style.display != 'none' && document.getElementById(div_name).style.display != "")
            {
                document.getElementById(div_name).style.display = 'none';
                document.getElementById(div_name).style.zIndex = 2;
                document.onclick = function(event){div_name = '';}
            }
        }
    }
	i_div.onclick = function()
	{//鼠标点击
        i_div.hidden();
		if (document.getElementById("selectchild" + obj.id) && !is_reload)
		{
            div_name = "selectchild" + obj.id;
			//判断是否创建过div
			if (child_create)
            {
				//判断当前的下拉是不是打开状态，如果是打开的就关闭掉。是关闭的就打开。
				document.getElementById("selectchild" + obj.id).style.display = "none";
                document.getElementById("selectchild" + obj.id).style.zIndex = 9999;
				child_create = false;
			}
			else
			{
				document.getElementById("selectchild" + obj.id).style.display = "";
				child_create = true;
			}
            document.onclick = function(){hide_select();}
		}
		else
		{
			if(is_reload)
			{
				if(document.getElementById("selectchild" + obj.id))
				{
					document.body.removeChild(document.getElementById("selectchild" + obj.id));
				}
			}
            
            div_name = "selectchild" + obj.id;
            document.onclick = function(){}
			//初始一个div放在上一个div下边，当options的替身。
			var c_div  =  document.createElement("div");
			c_div.id = "selectchild" + obj.id;
			c_div.style.position  =  "absolute";
            c_div.style.dispaly = 'block';
			c_div.style.textAlign  =  "left";
			c_div.style.cursor  =  "pointer";
			c_div.style.width = offset.width + over_width + "px";
			c_div.style.height = obj.options.length *20 + "px";
			c_div.style.top = (offset.top + offset.height + over_top) + "px";
			c_div.style.left = offset.left + "px";
			c_div.style.background = "#fff";
			c_div.style.border = "1px solid silver";
			c_div.style.color  =  "#000";
			var u_ul  =  document.createElement("ul");
			u_ul.id = "u_ulchild" + obj.id;
			u_ul.style.listStyle = "none";
			u_ul.style.margin = "0";
			u_ul.style.padding = "0";
			u_ul.style.fontSize = "12px";
			c_div.appendChild(u_ul);
			document.body.appendChild(c_div);
			child_create = true;
			if(is_reload)
			{
				u_ul.innerHTML = '';
			}
			for (var i = 0;i < obj.options.length; i++)
			{
				//将原始的select标签中的options添加到li中
				var l_li = document.createElement("li");
				l_li.id = obj.options[i].value;
				l_li.style.textIndent = "4px";
				l_li.style.height = "20px";
				l_li.style.paddingLeft = "3px";
				l_li.style.lineHeight = "20px";

				l_li.innerHTML = obj.options[i].innerHTML;
				u_ul.appendChild(l_li);
			}
			if (obj.options.length > 10) {
				c_div.style.height = '200px';
				c_div.style.overflowY = 'hidden';

				u_ul.style.height = '200px';
				u_ul.style.overflowY = 'scroll';
			}
			var li_obj = document.getElementById("u_ulchild" + obj.id).getElementsByTagName("li");
			for (var j = 0;j < obj.options.length; j++)
			{
				//为li标签添加鼠标事件
				li_obj[j].onmouseover = function()
				{
					this.style.background = "gray";
					this.style.color = "white";
				}
				li_obj[j].onmouseout = function()
				{
					this.style.background = "#fff";
					this.style.color = "black";
				}
				li_obj[j].onclick = function()
				{
					//做两件事情，一是将用户选择的保存到原始select标签中，要不做的再好看表单递交后也获取不到select的值了。
					//obj.options.length = 0;
					//obj.options[0] = new Option(this.innerHTML,this.id);
                    document.onclick = function(){div_name = '';}
					for(var op = 0; op< document.getElementById(obj.id).options.length; op++)
					{
						document.getElementById(obj.id).options[op] = new Option(document.getElementById(obj.id).options[op].text, document.getElementById(obj.id).options[op].value);
						if(document.getElementById(obj.id).options[op].value == this.id)
						{
							document.getElementById(obj.id).selectedIndex = op;
						}
					}
					if(typeof document.getElementById(obj.id).onchange != 'undefined' && document.getElementById(obj.id).onchange != null)
					{
						document.getElementById(obj.id).onchange();
					}
					//同时我们把下拉的关闭掉。
					document.getElementById("selectchild" + obj.id).style.display = "none";
                    document.getElementById("selectchild" + obj.id).style.zIndex =2;
					child_create = false;
					i_div.innerHTML = this.innerHTML;
				}
			}
            document.onclick = function(){hide_select()}
		}
	}
}
