CheckBoxList 控件ListItem项本身自带的没有ToolTip属性,但在开发中,时常会要用到此效果,故通过JS来实现
CS类:
chk.Items.Add(new ListItem("项目前期", "505004"));
chk.Items.Add(new ListItem("项目进行中", "505001"));
chk.Items.Add(new ListItem("项目中期", "505003"));
chk.Items.Add(new ListItem("项目后期", "505005"));
chk.Items.Add(new ListItem("项目结束", "505002"));
chk.Items.Add(new ListItem("项目意外中止", "505006"));//这里您可以绑定数据库里的数据
for (int i = 0; i < chk.Items.Count; i++)
{
chk.Items[i].Attributes.Add("onmouseover", "showToolTip(event,'" + chk.Items[i].Value + "')");
}
aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>无标题页</title>
</head>
<script type="text/javascript" language="javascript">
function showToolTip(e,tex) {
var obj = (e.srcElement) ? e.srcElement : (e.target) ? e.target : null;
if (obj.tagName == 'LABEL')
{
obj.title =tex.toString();
// obj.title = "obj.innerHTML";
}
else {debugger;
//alert(obj.nextSibling.innerHTML);
obj.title = obj.nextSibling.innerHTML;
}
}
</script>
<body>
<form id="form1" runat="server">
<div>
<asp:CheckBoxList ID="chk" runat="server">
</asp:CheckBoxList>
</div>
</form>
</body>
</html>