<Meta content = "text/html; charset = UTF-8" http-equiv = "Content-Type"/> <style type = "text/CSS">
<! --
Body {Background: # fff}
. Menu {
Position: relative;
Width: 204px;
Height: pixel PX;
Z-index: 1;
Background: # FFF;
Border: 1px solid #000;
Margin-top:-100px;
Display: none;
}
. Menu2 {
Position: absolute;
Left: 0;
Top: 0;
Width: 100%;
Height: auto;
Overflow: hidden;
Z-index: 1;
}
. Menu2 ul {margin: 0; padding: 0}
. Menu2 ul Li {width: 100%; Height: 25px; line-Height: 25px; text-indent: 15px;
Border-bottom: 1px dashed # CCC; color: #666; cursor: pointer;
Change: expression (
This. onmouseover = function (){
This. style. Background = "# f2f5ef ";
},
This. onmouseout = function (){
This. style. Background = "";
}
)
}
Input {width: 200px}
. FORM {width: 200px; Height: auto ;}
. Form Div {position: relative; top: 0; left: 0; margin-bottom: 5px}
# List1, # list2, # list3 {left: 0px; top: 93px ;}
--> </Style> </P>
<SCRIPT type = "text/JavaScript">
Function showandhide (OBJ, types ){
VaR layerpolicw.doc ument. getelementbyid (OBJ );
Switch (types ){
Case "show ":
Layer. style. Display = "Block ";
Break;
Case "hide ":
Layer. style. Display = "NONE ";
}
}
Function getvalue (OBJ, STR ){
VaR input000000000000doc ument. getelementbyid (OBJ );
Input. value = STR;
}
</SCRIPT>
<Div class = "form">
<Div> location: <input id = "TXT" onblur = "showandhide ('list1', 'hide ');" onclick = "showandhide ('list1 ', 'show'); "name =" TXT "type =" text "/> </div>
<! -- List 1 -->
<Div class = "menu" id = "list1">
<Div class = "menu2">
<Ul>
<Li onmousedown = "getvalue ('txt ', 'China China'); showandhide ('list1', 'hide');"> China </LI>
<Li onmousedown = "getvalue ('txt ', 'USA USA'); showandhide ('list1', 'hide ');"> USA </LI>
</Ul>
</Div>
</Div>
<Div> sex: <input id = "txt2" onblur = "showandhide ('list2', 'hide ');" onclick = "showandhide ('list2 ', 'show'); "name =" txt2 "type =" text "/> </div>
<! -- List 2 -->
<Div class = "menu" id = "list2">
<Div class = "menu2">
<Ul>
<Li onmousedown = "getvalue ('txt2', 'male'); showandhide ('list2', 'hide ');"> male </LI>
<Li onmousedown = "getvalue ('txt2', 'female '); showandhide ('list2', 'hide');"> female </LI>
</Ul>
</Div>
</Div>
<Div> Education: <input id = "txt3" onblur = "showandhide ('list3', 'hide ');" onclick = "showandhide ('list3 ', 'show'); "name =" txt3 "type =" text "/> </div>
<! -- List 3 -->
<Div class = "menu" id = "list3">
<Div class = "menu2">
<Ul>
<Li onmousedown = "getvalue ('txt3 ', ''); showandhide ('list3', 'hide ');"> Junior College </LI>
<Li onmousedown = "getvalue ('txt3 ', ''); showandhide ('list3', 'hide ');"> bachelor </LI>
<Li onmousedown = "getvalue ('txt3 ', 'master'); showandhide ('list3', 'hide');"> master </LI>
<Li onmousedown = "getvalue ('txt3 ', ''); showandhide ('list3', 'hide ');"> bachelor </LI>
</Ul>
</Div>
</Div>
</Div>