放一个input和一个select
写select的onclick事件，判断选择的是“第一个”，则将选择的text传给input，同时将select隐藏，显示input
写input的onclick事件，隐藏input，显示select，同时将select的选中项定位到input框中的值对应的那一项方法告诉你，代码自己写写看吧
写select的onclick事件，判断选择的是“第一个”，则将选择的text传给input，同时将select隐藏，显示input
写input的onclick事件，隐藏input，显示select，同时将select的选中项定位到input框中的值对应的那一项方法告诉你，代码自己写写看吧
<option> 第一个 </option>
<option> 第二个 </option>
</select><div id="d1" onclick="this.style.display='none';document.getElementById('select2').style.display='';">请选择</div>
<head>
<script>
function aa(){
var select2=document.getElementById("inputToSelect");
var input=document.getElementById("selectToInput");
var value=select2.options[select2.selectedIndex].text;
input.value=value;
input.style.display="";
select2.style.display="none";
}
function bb(){
var select2=document.getElementById("inputToSelect");
var input=document.getElementById("selectToInput");
var value=select2.value;
var arr=select2.options;
var i;
for(i=0;i<arr.length;i++){
if(arr.text==value){
select2.selectedIndex=i;
}
}
input.style.display="none";
select2.style.display=""; }
</script>
</head>
<body >
<table>
<tr>
<td>
<input type="text" value="d" id="selectToInput" style="display:none" onmouseover="bb();">
<select id="inputToSelect" onmouseleave="aa();">
<option selected>No11</opiont>
<option>No2</option>
</select>
</td>
</tr>
</table>
</body>
</html>随便写了下，有bug表怪我啊，我把点击事件改成了鼠标移入移出事件，这样更好一些