[javascript]可编辑的下拉列表。

<HTML>
 <HEAD>
<style>
.ptext{ 
	position:absolute;
	height:22px !important;
	height:21px;
}
.pselect{ 
	position:absolute;height:20px;
	border-left:0px;
}
</style>
 <SCRIPT LANGUAGE="javascript">
function Body_Init(oSelectid,oTextid)
{
oSelect = document.getElementById(oSelectid);
oText = document.getElementById(oTextid);
voText = document.getElementById("v"+oTextid);

var iLeft= oSelect.offsetLeft;
 var iTop = oSelect.offsetTop;
 var iWidth=oSelect.offsetWidth;
 var iHeight=oSelect.offsetHeight;

oSelect.style.clip='rect(0,'+iWidth+','+iHeight+','+(iWidth-18)+')';

oText.style.top =iTop;
 oText.style.left=iLeft;
 oText.style.width=iWidth-17;
 oText.style.height=iHeight;

oText.value = oSelect.options[0].text;
 voText.value = oSelect.options[0].value;
}
function Combo_Select(oSelectid,oTextid)
{
 oSelect = document.getElementById(oSelectid);
 oText = document.getElementById(oTextid);
 voText = document.getElementById("v"+oTextid);
 voText.value = oSelect.options[oSelect.selectedIndex].value ;
 oText.value = oSelect.options[oSelect.selectedIndex].text ;
 //alert(oText.value);
}
 </script>
 </head>
 <BODY>

<table width=50%  align="center" valign="middle">
 <tr><td>
 <INPUT class="ptext"   TYPE="TEXT" NAME="vpText" id="vpText"><br/>
 
 <INPUT class="ptext"   TYPE="TEXT" NAME="pText" id="pText">
  <SELECT size="1" class="pselect"    ONCHANGE="Combo_Select(this.id,'pText')" NAME="pCombo" id="pCombo">
    <option value="7090">7777</option>
  <option value="d">test1浮动幅度随风倒随风倒</option>
  <option value="dd">test2fd</option>  
  </select>
    </td></tr>
  </table>
  <script language="javascript" type="text/javascript">
  <!--

Body_Init('pCombo','pText');

pTextObj = document.getElementById('pText');
	pComboObj = document.getElementById('pCombo');
  al ="";
  al += "pTextObj.style.top="+pTextObj.style.top+"\n";
  al += "pTextObj.style.left="+pTextObj.style.left+"\n";
  al += "pTextObj.style.width="+pTextObj.style.width+"\n";
al += "pTextObj.style.height="+pTextObj.style.height+"\n";

al += "pComboObj.offsetTop="+pComboObj.offsetTop+"\n";
  al += "pComboObj.offsetLeft="+pComboObj.offsetLeft+"\n";

al += "pComboObj.clientWidth="+pComboObj.clientWidth+"\n";
al += "pComboObj.clientHeight="+pComboObj.clientHeight+"\n";

al += "pComboObj.offsetwidth="+pComboObj.offsetWidth+"\n";
al += "pComboObj.offsetheight.height="+pComboObj.offsetHeight+"\n";

//alert(al);

//-->
  </script>
  </body>
</html>

Posted on 2005-10-20 19:07 古代阅读(258) 评论(0) 编辑收藏举报

刷新页面返回顶部