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 ; // 文本長(zhǎng)度
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;
???? // 點(diǎn)擊鍵盤上下鍵，選擇框得到焦點(diǎn)
???? if ((keyCode == 38 ? || ?keyCode == 40 )? && ?oDiv.style.visibility? == ? " visible " ) {
????????oSelect.focus();
????}
???? // 選擇框圖層顯示時(shí)，點(diǎn)擊回車選擇第一個(gè)選項(xiàng)
???? 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???--?添加值的對(duì)象
oSelect?--?選擇值的對(duì)象

//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??--?要顯示的圖層對(duì)象
oArea?--?要顯示的圖層位置的對(duì)象

//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??--?要隱藏的圖層對(duì)象
oFocus--?圖層隱藏后，要得到焦點(diǎn)的對(duì)象
*/
function ?hideTip(oDiv,oFocus) {
????oDiv.style.visibility? = ? " hidden " ;
????oFocus.focus();
}
/**/ /*
匹配驗(yàn)證?
oArea?--?需要驗(yàn)證的內(nèi)容
*/
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 >