<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
var selectedOption =new Array();
function createbutton(elem)
{
$addHandlers(elem,
{
mouseover:showHoverStyle,
mouseout:showDefaultSyle,
click:handleClick
}
);
}
function showHoverStyle()
{
if(!Sys.UI.DomElement.containsCssClass(this,"clicked"))
{
Sys.UI.DomElement.addCssClass(this,"hover");
}
}
function showDefaultSyle()
{
Sys.UI.DomElement.removeCssClass(this,"hover");
}
function handleClick()
{
Sys.UI.DomElement.removeCssClass(this,"hover");
Sys.UI.DomElement.toggleCssClass(this,"clicked");
if(Sys.UI.DomElement.containsCssClass(this,"clicked"))
{
if(!Array.contains(selectedOption,this.innerHTML))
{
Array.add(selectedOption,this.innerHTML);
}
}
else
{
Array.remove(selectedOption,this.innerHTML);
}
var textBuilder=new Sys.StringBuilder();
for(var index=0;index<selectedOption.length;index++)
{
textBuilder.append(selectedOption[index]);
}
$get("selectedOption").innerHTML=textBuilder.toString(", ");
}
function pageLoad()
{
var childNodes=$get("Buttons").childNodes;
var count=childNodes.length;
for(var index=0;index<count;++index)
{
createbutton(childNodes[index]);
}
}
</script>
<style type="text/css">
#Buttons div
{
padding:3px;
margin:1px 4px;
width 80px;
border :1px solid #555555;
font-weight: bold;
float: left;
cursor:pointer;
}
.clicked
{
background-color: #363636;
}
.hover
{
background-color: #999999;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div id="Buttons">
<div id="Option1">Option 1</div>
<div id="Option2">Option 2</div>
<div id="Option3">Option 3</div>
<div id="Option4">Option 4</div>
<div id="Option5">Option 5</div>
</div>
<span id="selectedOption"></span>
</form>
</body>
</html>
帮忙看一下!!
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
var selectedOption =new Array();
function createbutton(elem)
{
$addHandlers(elem,
{
mouseover:showHoverStyle,
mouseout:showDefaultSyle,
click:handleClick
}
);
}
function showHoverStyle()
{
if(!Sys.UI.DomElement.containsCssClass(this,"clicked"))
{
Sys.UI.DomElement.addCssClass(this,"hover");
}
}
function showDefaultSyle()
{
Sys.UI.DomElement.removeCssClass(this,"hover");
}
function handleClick()
{
Sys.UI.DomElement.removeCssClass(this,"hover");
Sys.UI.DomElement.toggleCssClass(this,"clicked");
if(Sys.UI.DomElement.containsCssClass(this,"clicked"))
{
if(!Array.contains(selectedOption,this.innerHTML))
{
Array.add(selectedOption,this.innerHTML);
}
}
else
{
Array.remove(selectedOption,this.innerHTML);
}
var textBuilder=new Sys.StringBuilder();
for(var index=0;index<selectedOption.length;index++)
{
textBuilder.append(selectedOption[index]);
}
$get("selectedOption").innerHTML=textBuilder.toString(", ");
}
function pageLoad()
{
var childNodes=$get("Buttons").childNodes;
var count=childNodes.length;
for(var index=0;index<count;++index)
{
createbutton(childNodes[index]);
}
}
</script>
<style type="text/css">
#Buttons div
{
padding:3px;
margin:1px 4px;
width 80px;
border :1px solid #555555;
font-weight: bold;
float: left;
cursor:pointer;
}
.clicked
{
background-color: #363636;
}
.hover
{
background-color: #999999;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div id="Buttons">
<div id="Option1">Option 1</div>
<div id="Option2">Option 2</div>
<div id="Option3">Option 3</div>
<div id="Option4">Option 4</div>
<div id="Option5">Option 5</div>
</div>
<span id="selectedOption"></span>
</form>
</body>
</html>
帮忙看一下!!
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货