// JavaScript Document

function opts(selectObj){
 var optDivs=document.createElement("div");
 var objTable=document.createElement("table");
  var objTbody=document.createElement("tbody");
  optDivs.style.zIndex = "100";
  objTable.style.zIndex = "100";
  objTable.width=selectObj.style.width;

 //确定div的位置刚好在selectObj下
 var e = selectObj;
 var absTop = e.offsetTop;
 var absLeft = e.offsetLeft;
 var absWidth = e.offsetWidth;
 var absHeight = e.offsetHeight;
 
 while(e = e.offsetParent)
{
   
	 absTop += e.offsetTop;
     absLeft += e.offsetLeft;
 }
 with (objTable.style)
{
     position = "absolute";
     top = (absTop + absHeight) + "px";
     left = absLeft + "px";
     border = "1px solid black";
     tableLayout="fixed";//定长,不想要就注释掉
     wordBreak="break-all";//多行,不想要就注释掉
 }
 
 var options = selectObj.options;
 var val=selectObj.value;
 if (options.length > 0)
 {
     for (var i = 0; i < options.length; i++)
     {
         var newOptDiv = document.createElement("td");
         var objRow=document.createElement("tr");
		 
         newOptDiv.name=options[i].value;
         newOptDiv.innerText=options[i].innerText;
         newOptDiv.title=options[i].title;
         //newOptDiv.onclick=function() {choose(selectObj,val,optDivs)};
         newOptDiv.onmouseout = function()
		 {
		 	this.className="mouseOut";
			val=selectObj.value
		 };
        newOptDiv.onmouseover = function()
		{
			this.className="mouseOver";
			val=this.name;
		};
        newOptDiv.className="mouseOut";
        newOptDiv.style.width=selectObj.style.width;
        
         objRow.appendChild(newOptDiv);
         objTbody.appendChild(objRow);
     }
 }
 objTbody.appendChild(objRow);
 objTable.appendChild(objTbody);
 optDivs.appendChild(objTable);
 document.body.appendChild(optDivs);
 //用ifram覆盖下面的select
var IfrRef = document.createElement("iframe");
IfrRef.style.position="absolute";
IfrRef.style.width = objTable.offsetWidth;
IfrRef.style.height = objTable.offsetHeight;
IfrRef.style.top = objTable.style.top;
IfrRef.style.left = objTable.style.left;
IfrRef.style.zIndex = optDivs.style.zIndex -1;
IfrRef.style.display = "block";
document.body.appendChild(IfrRef);

 objTable.focus();
// objTable.onblur= choose(selectObj,val,optDivs,IfrRef);
  objTable.onblur=function(){choose(selectObj,val,optDivs,IfrRef)};
 
}
function choose(objselect,val,delobj,delobj2){
    objselect.value=val;
	//alert(delobj)
    document.body.removeChild(delobj);
    document.body.removeChild(delobj2);
}


