61,129
社区成员
发帖
与我相关
我的任务
分享
...全文
请发表友善的回复…
发表回复
zjyaoo 2009-01-14
- 打赏
- 举报
太复杂了,为了一个功能没有必要
Ischema 2007-05-25
- 打赏
- 举报
转载的代码，用div实现，楼主参考：
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>所属区域</td>
<td>
<br><br>
<input type="text" id="txtRegion" />
<div id="divRegionList" style="display: none; border: 1px solid #0000ff; overflow: hidden; height: 150px; position: absolute; background-color: #ff0000;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<div style="overflow: auto; width: 100%; height: 132px; background-color: #90EE90;">
<ol>
<li>北京</li>
<li>天津</li>
<li>上海</li>
<li>重庆</li>
<li>河北</li>
<li>河南</li>
<li>山东</li>
<li>山西</li>
<li>江西</li>
<li>江苏</li>
<li>浙江</li>
<li>内蒙古</li>
</ol>
</div>
</td>
</tr>
<tr>
<td align="right" id="tdClose" style="cursor: hand; background-color: #ff8888;">Close</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td>状态</td>
<td><input type="text" id="txtState" /></td>
</tr>
</table>
<script type="text/javascript">
<!--
var oRegion = document.getElementById("txtRegion");
var oRegionList = document.getElementById("divRegionList");
var oClose = document.getElementById("tdClose");
var colOptions = document.getElementsByTagName("li");
var bNoAdjusted = true;
oClose.onclick = function()
{
oRegionList.style.display = "none";
};
for (var i=0; i<colOptions.length; i++)
{
colOptions[i].style.cursor = "hand";
colOptions[i].onclick = function()
{
oRegion.value = this.innerText;
};
colOptions[i].onmouseover = function()
{
this.style.backgroundColor = "#ffff00";
};
colOptions[i].onmouseout = function()
{
this.style.backgroundColor = "";
};
}
oRegion.onfocus = function()
{
oRegionList.style.display = "block";
if (bNoAdjusted)
{
bNoAdjusted = false;
oRegionList.style.width = this.offsetWidth - 2;
oRegionList.style.posTop = oRegionList.offsetTop + this.offsetHeight;
oRegionList.style.posLeft = oRegionList.offsetLeft - this.offsetWidth - 8;
}
};
//-->
</script>
</body>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>所属区域</td>
<td>
<br><br>
<input type="text" id="txtRegion" />
<div id="divRegionList" style="display: none; border: 1px solid #0000ff; overflow: hidden; height: 150px; position: absolute; background-color: #ff0000;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<div style="overflow: auto; width: 100%; height: 132px; background-color: #90EE90;">
<ol>
<li>北京</li>
<li>天津</li>
<li>上海</li>
<li>重庆</li>
<li>河北</li>
<li>河南</li>
<li>山东</li>
<li>山西</li>
<li>江西</li>
<li>江苏</li>
<li>浙江</li>
<li>内蒙古</li>
</ol>
</div>
</td>
</tr>
<tr>
<td align="right" id="tdClose" style="cursor: hand; background-color: #ff8888;">Close</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td>状态</td>
<td><input type="text" id="txtState" /></td>
</tr>
</table>
<script type="text/javascript">
<!--
var oRegion = document.getElementById("txtRegion");
var oRegionList = document.getElementById("divRegionList");
var oClose = document.getElementById("tdClose");
var colOptions = document.getElementsByTagName("li");
var bNoAdjusted = true;
oClose.onclick = function()
{
oRegionList.style.display = "none";
};
for (var i=0; i<colOptions.length; i++)
{
colOptions[i].style.cursor = "hand";
colOptions[i].onclick = function()
{
oRegion.value = this.innerText;
};
colOptions[i].onmouseover = function()
{
this.style.backgroundColor = "#ffff00";
};
colOptions[i].onmouseout = function()
{
this.style.backgroundColor = "";
};
}
oRegion.onfocus = function()
{
oRegionList.style.display = "block";
if (bNoAdjusted)
{
bNoAdjusted = false;
oRegionList.style.width = this.offsetWidth - 2;
oRegionList.style.posTop = oRegionList.offsetTop + this.offsetHeight;
oRegionList.style.posLeft = oRegionList.offsetLeft - this.offsetWidth - 8;
}
};
//-->
</script>
</body>
