当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 【推荐】一个非常漂亮的列表框

Javascript
JavaScript脚本:在网页中绘制图表
Jquery在实用和易学使用上的特点
网页制作之Javascript代码技巧
利用Java程序把Word文档转换成Html文件
提供gif icon制作的几个站点
JavaScript 实现 Konami Code
实用Javascript Tab导航插件23个
掌握JavaScript语言的思想前提
可以制作动画菜单效果的jquery插件
从脚本编程的角度看JSP的安全
JavaScript教程：伸缩菜单的制作
Javascript 代码也可以变得优美
与JavaScript新人共同分享实用经验
远程控制顺畅无阻碍-java来实现
Java开源的高性能缓存框架
通过代理访问因特网上的Web服务器
JavaScript基础教程：调试及应用
通过SSH交互进行Java应用开发
Java API编写自己的NamespaceContext
Java编程教程：SecureJSH特性简介

No. « 172 173 174 175 »

技术文章搜索

关键字

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

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-08-10   浏览: 252 ::
收藏到网摘: n/a

<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>