首页 > 开发 > 综合 > 正文

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

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>
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表