哈哈,看看做出来的效果:
为了你也能实现出来,可以参考下面的方法,第一是准备好一个对象“地支”(terrestrial branch)
terrestrialbranch.cs
复制代码 代码如下:
using system;
using system.collections.generic;
using system.linq;
using system.web;
/// <summary>
/// summary description for terrestrialbranch
/// </summary>
namespace insus.net
{
public class terrestrialbranch
{
private int _id;
private string _name;
public int id
{
get{return _id;}
set { _id = value; }
}
public string name
{
get { return _name; }
set { _name = value; }
}
public terrestrialbranch()
{
//
// todo: add constructor logic here
//
}
public terrestrialbranch(int id, string name)
{
this.id = id;
this._name = name;
}
}
}
用数据填充这个对象,并用泛型list<t>来存储这十二个对象:
复制代码 代码如下:
private list<terrestrialbranch> getdata()
{
list<terrestrialbranch> tbs = new list<terrestrialbranch>();
tbs.add(new terrestrialbranch(1,"子"));
tbs.add(new terrestrialbranch(2, "丑"));
tbs.add(new terrestrialbranch(3, "寅"));
tbs.add(new terrestrialbranch(4, "卯"));
tbs.add(new terrestrialbranch(5, "辰"));
tbs.add(new terrestrialbranch(6, "巳"));
tbs.add(new terrestrialbranch(7, "午"));
tbs.add(new terrestrialbranch(8, "未"));
tbs.add(new terrestrialbranch(9, "申"));
tbs.add(new terrestrialbranch(10, "酉"));
tbs.add(new terrestrialbranch(11, "戌"));
tbs.add(new terrestrialbranch(12, "亥"));
return tbs;
}
在.aspx页面拉一个checkboxlist控件,设置两个属性repeatcolumns="6" repeatdirection="horizontal"
复制代码 代码如下:
<asp:checkboxlist id="checkboxlistterrestrialbranch" runat="server" repeatcolumns="6" repeatdirection="horizontal"></asp:checkboxlist>
把刚才准备好的list<terrestrialbranch>绑定给这个checkboxlist控件:
复制代码 代码如下:
using system;
using system.collections.generic;
using system.data;
using system.data.oledb;
using system.linq;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;
using insus.net;
public partial class _default : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
if (!ispostback)
data_binding();
}
private void data_binding()
{
this.checkboxlistterrestrialbranch.datasource = getdata();
this.checkboxlistterrestrialbranch.datatextfield = "name";
this.checkboxlistterrestrialbranch.datavaluefield = "id";
this.checkboxlistterrestrialbranch.databind();
}
}
ok,一切准备就绪,可以写javascript脚本,放在<head>之内。
复制代码 代码如下:
window.onload = function () {
var cbl = document.getelementbyid('<%= checkboxlistterrestrialbranch.clientid %>')
var inputs = cbl.getelementsbytagname("input");
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == "checkbox") {
inputs[i].onclick = function () {
var cbs = inputs;
for (var i = 0; i < cbs.length; i++) {
if (cbs[i].type == "checkbox" && cbs[i] != this && this.checked) {
cbs[i].checked = false;
}
}
}
}
}
}
您可能感兴趣的文章:
- RabbitMQ单机集群搭建出现Error: unable to perform an operation on node 'rabbit1@ClusterNode1'
- DotNetty在window和linux下的性能对比
- WPF简单的分页控件实现
- ASP.NET中实现中文简/繁体自动转换的类
- .net core 图片合并,图片水印,等比例缩小,SixLabors.ImageSharp
- 前后端分离,https站点无法通过Ajax访问http资源(Mixed Content,The page at 'https://xxx.com' was loaded over HTTPS)
- layui,返回的数据不符合规范,正确的成功状态码 (code) 应为:0
如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!
网友评论