【推薦】一個非常漂亮的列表框
2024-07-21 02:14:21
供稿：網友
<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
></p>
<p>列表框演示程序：</p>
</body>
</html>
