【推荐】一个非常漂亮的列表框

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 soff 的 blog

<html>
<head>
<title></title>
<script language=javascript>
function getselected()
{
return listtext.innertext
}

function listi_onmouseover(item)
{
listi0.style.color = lb_fgc
listi1.style.color = lb_fgc
listi2.style.color = lb_fgc
listi3.style.color = lb_fgc
listi4.style.color = lb_fgc

item.style.color = lb_hfc
}

function listi_onmouseout(item)
{
item.style.color = lb_fgc
}

function listi_onclick(item)
{
listi0.style.backgroundcolor = lb_bgc
listi1.style.backgroundcolor = lb_bgc
listi2.style.backgroundcolor = lb_bgc
listi3.style.backgroundcolor = lb_bgc
listi4.style.backgroundcolor = lb_bgc
item.style.backgroundcolor = lb_hbc
listtext.innertext = item.innertext
alert("you click " + item.innertext + "!")
}

function writelistbox()
{
document.write("<span id=listtext style=\"display: none\"></span>")

document.write(" <div id=list")
document.write(" style =\"background-color: " + lb_bgc + ";")
document.write(" border-bottom: " + lb_bc + " " + lb_bw + " solid;")
document.write(" border-left: " + lb_bc + " " + lb_bw + " solid;")
document.write(" border-right: " + lb_bc + " " + lb_bw + " solid;")
document.write(" border-top: " + lb_bc + " " + lb_bw + " solid;")
document.write(" position: absolute; height: 99px;")
document.write(" left: " + lb_left + "; top: " + lb_top + "; width: " + lb_width + "\">")
  var i
  for(i=0; i<listboxdata.length; i++)
  {
document.write("<span id=listi" + i)
document.write(" style=\"background-color: " + lb_bgc + "; cursor: hand;")
document.write(" color: " + lb_fgc + "; padding-left: 10px; width: " + (lb_width - 2 * lb_bw) + "\"")
document.write(" language=\"javascript\"")
document.write(" onmouseover=\"return listi_onmouseover(listi" + i + ")\"")
document.write(" onmouseout=\"return listi_onmouseout(listi" + i + ")\"")
document.write(" onclick=\"return listi_onclick(listi" + i + ")\">")
document.write(" " + listboxdata[i] + "</span><br>")
}
document.write("</div>")
}

var listboxdata = new array()

var lb_bgc = "papayawhip"
var lb_fgc = "green"
var lb_hbc = "orange"
var lb_hfc = "red"
var lb_bc = "red"
var lb_bw = 1
var lb_width = 90
var lb_left = 80
var lb_top = 100

listboxdata[0] = "item0"
listboxdata[1] = "item1"
listboxdata[2] = "item2"
listboxdata[3] = "item3"
listboxdata[4] = "item4"

writelistbox()

</script>
</head>

<body>

<p><input type="button" value="selected" id=button1 name=button1
language=javascript
onclick="alert('you selected ' + listtext.innertext + '!')"></p>
<p>列表框演示程序:</p>

</body>
</html>

本文关键:【推荐】一个非常漂亮的列表框
  相关方案
Google
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top