yyg1107

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

< HTML >
< HEAD >
< TITLE >  New Document  </ TITLE >
< META  NAME ="Generator"  CONTENT ="EditPlus" >
< META  NAME ="Author"  CONTENT ="" >
< META  NAME ="Keywords"  CONTENT ="" >
< META  NAME ="Description"  CONTENT ="" >

< SCRIPT  LANGUAGE ="JavaScript" >
<!--
var  showFlag  =   0 ; // 0.弹出提示框;1.取消弹出提示框
var  textLength  =   0 ; // 文本长度
document.onkeydown  =   function  keyDown() {
     var  keyCode  =  event.keyCode;
     var  oSelect  =  document.getElementById( " select1 " );
     var  oDiv  =  document.getElementById( " divTip1 " );
     var  oArea  =  document.getElementById( " area1 " );
     var  sValue    =  oArea.value;
     // 点击键盘上下键，选择框得到焦点
     if ((keyCode == 38   ||  keyCode == 40 )  &&  oDiv.style.visibility  ==   " visible " ) {
        oSelect.focus();
    }
     // 选择框图层显示时，点击回车选择第一个选项
     if (oDiv.style.visibility  ==   " visible "   &&  keyCode == 13 ) {
        oSelect.focus();
        oSelect.selectedIndex  =   0 ;
        oArea.value = sValue.substring( 0 ,sValue.length - 1 ) + oSelect.value;
        hideTip(oDiv,oArea); // 隐藏图层select
         // show1.innerHTML = oSelect.value;
    }
}
/**/ /*
选取值，添加到textarea
oArea   -- 添加值的对象
oSelect -- 选择值的对象

//var oArea = document.getElementById("area1");
//var oSelect = document.getElementById("select1");
*/
function  selectedValue(oDiv,oArea ,oSelect) {
     var  sValue    =  oArea.value;
    oArea.value = sValue.substring( 0 ,sValue.length - 1 ) + oSelect.value;
    hideTip(oDiv,oArea); // 隐藏图层select
}
/**/ /*
显示图层select
oDiv  -- 要显示的图层对象
oArea -- 要显示的图层位置的对象

//var oDiv = document.getElementById("divTip1");
//var oArea=document.getElementById("area1");
*/
function  showTip(oDiv,oArea,oSelect) {
     if (checkValue(oArea)  &&  showFlag  ==   0 ) {
        oDiv.style.visibility  =   " visible " ;
        oSelect.focus();
         var  t  =  oArea.offsetTop + event.srcElement.createTextRange().text.length; 
         var  l  =  oArea.offsetLeft + event.srcElement.createTextRange().text.length; 
        oDiv.style.left  =  l * 2 + 10 ;
        oDiv.style.top   =  t * 2 + 10 ;
    } else {
        hideTip(oDiv,oArea);
    }
}
/**/ /*
隐藏图层select
oDiv  -- 要隐藏的图层对象
oFocus-- 图层隐藏后，要得到焦点的对象
*/
function  hideTip(oDiv,oFocus) {
    oDiv.style.visibility  =   " hidden " ;
    oFocus.focus();
}
/**/ /*
匹配验证 
oArea -- 需要验证的内容
*/
function  checkValue(oArea) {
     var  template  =  [ " 黑色 " , " 红色 " , " 黄色 " , " 兰色 " , " 绿色 " , " 灰色 " , " 兰色 " , " 棕色 " , " 白色 " ]
     var  oSelect   =  document.getElementById( " select1 " );
     var  lastSelectText  =  oArea.value.charAt(oArea.value.length - 1 );
     if (oArea.value.length  !=  textLength) {
        textLength  =  oArea.value.length;
        showFlag    =   0 ;
    }
    oSelect.length  =   0 ;
     for ( var  i  = 0 ;i < template.length;i ++ ) {
         if (template[i].indexOf(lastSelectText) == 0    &&  lastSelectText != "" ) {
             var  option  =   new  Option(template[i],template[i]);
             try {
                oSelect.add(option);
            } catch (e) {}
        }     
    }
     var  iNewSize  =  oSelect.length;
    oSelect.size  =  iNewSize;
     if (iNewSize == 0 ) 
         return   false ;
     else
         return   true ;
}
function  cannelShowTip() {
    showFlag  =   1 ;
}
// -->
</ SCRIPT >
</ HEAD >

< BODY >
< TEXTAREA  id ="area1"  NAME ="area1"  ROWS ="20"  COLS ="100"  onkeyup ="showTip(divTip1,this,select1)"  onClick ="showTip(divTip1,this,select1)"  onFocus ="cannelShowTip()" ></ TEXTAREA >
< div  id ="divTip1"  style ="position:absolute;visibility:hidden;padding:5px" >
< select  id ="select1"  name ="select1"  mulitple ="mulitple"  size ="4"  onclick ="selectedValue(divTip1,area1,this)"   >
< option  value =1 > 1 </ option >
< option  value =11 > 11 </ option >
< option  value =2 > 2 </ option >
< option  value =3 > 3 </ option >
</ select >
</ div >
< INPUT  TYPE ="button"  NAME =""  onclick ="" >
< div  id =show1 ></ div >
< div  id =show2 ></ div >
</ BODY >
</ HTML >