[size=large][color=blue]頁面設計時，在實際應用中我們常常要用到輸入框、下拉選擇框等控件；但有時候爲了滿足特別的要求我們會用到可選可輸入的“下拉選擇輸入框”，設計源碼如下：
<html>
<head>
</style>
</head>
<body>
<h1>測試可選可輸入文本框<br><br><br></h1>
<tr>
<td>請輸入或直接選擇</td>
<td align="center"style="border-left: 1px #CCCCCC solid; border-right: 1px #CCCCCC solid;border-bottom: 1px #CCCCCC solid;">
<div style="position:relative;left:200px;top:-15px;">
<span style="margin-left:132px;width:30px;overflow:hidden;position:absolute;left:10px;top:0px">
<select style="width:150px;margin-left:-132px" onchange="this.parentNode.nextSibling.value=this.value">
<option value="15110103">15110103</option>
<option value="15110102">15110102</option>
</select>
</span>
<input name="accC1" value="15110103" style="width:132px;position:absolute;left:10px;top:0px;">
</div>
</td>
</tr>
<!-- 可選可輸入控件是有 input和select拼起來的組合控件，並不是真正意義上的單一可選可輸入控件，只是在視覺效果和性能上完全滿足要求-->
<!--依次解釋控件中參數的意義：-->
<!-- 1、div中的style參數中position屬性，由它來決定組合控件的位置-->
<!-- 2、span中的style參數中 margin-left:132px爲顯示選擇框左邊顯示數據部分預留的寬度，width:18px爲倒三角號顯示預留的寬度-->
<!-- 3、select中的style參數中 width:150px爲下拉選擇框的寬度，位置：position:absolute-->
<!-- 4、input中的style參數中 width:132px爲文本輸入框的寬度，位置：position:absolute-->
<!-- 5、文本輸入框的寬度等於下拉選擇框的倒三角號左邊部分，位置與選擇框正好重合，蓋住了選擇框的左邊部分，從而實現了可選可輸入文本框的效果-->
</body>
</html>[/color][/size]
頁面中可選可輸入文本框的實現
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章
探索Win32系統之窗口類（Window Classes in Win32）(異域の蝸牛注：關於win32編程中的窗口類的探討)
作者：vcbear 翻譯說明：以前一直沒有很在意窗口類的使用，我近期在用vc做一些界面時遇到窗口類定義的概念，這次翻MSDN的時候看
C++面試題之螺旋隊列
//螺旋隊列.cpp// 21 22 ... ...// 20 7 8 9 10// 19 6 1 2 11// 18 5 4 3 12// 17 16 15 14 13//看