ASP.NET CheckBoxList 用javascript 实现全选

最新推荐文章于 2019-01-08 02:45:55 发布

yjpbibi

最新推荐文章于 2019-01-08 02:45:55 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript asp.net function object server table

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.youkuaiyun.com/yjpbibi/article/details/1771601

本文介绍如何使用 ASP.NET 中的 CheckBoxList 控件实现全选功能与单独选择功能之间的联动效果。通过 JavaScript 和 C# 的配合，可以实现在勾选“全选”选项时自动选中下面的所有选项，当取消勾选任一单独选项时，“全选”也会相应取消。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

javascript:

   function CheckAll()
     {
      var checkboxlist1;
      var checkboxlist2;

      checkboxlist1=document.getElementById("CheckBoxList2");

      checkboxlist2=document.getElementById("CheckBoxList1");

      if(checkboxlist1.rows[0].cells(0).childNodes(0).checked)
      {
         for (i = 0; i < checkboxlist2.rows.length; i++)
            {
                checkboxlist2.rows[i].cells(0).childNodes(0).checked=true;
            }
      }
      else
      {
         for (i = 0; i < checkboxlist2.rows.length; i++)
            {
                checkboxlist2.rows[i].cells(0).childNodes(0).checked=false;
            }
      }

     }

     function CheckAlone()
     {
     var checkboxlist1;
      var checkboxlist2;

      checkboxlist1=document.getElementById("CheckBoxList2");

      checkboxlist2=document.getElementById("CheckBoxList1");

      var count=0;
       for (i = 0; i < checkboxlist2.rows.length; i++)
            {
               if( checkboxlist2.rows[i].cells(0).childNodes(0).checked==false)
               {
                 count++;
               }
            }
            if(count>0)
            {
            checkboxlist1.rows[0].cells(0).childNodes(0).checked=false;
            }

     }

.asp 文件

        <table width="369px" style="background-color: antiquewhite" >
            <tr>
                <td style="text-align: center;" >
                     <asp:CheckBoxList id="CheckBoxList2" runat="server" Font-Names="宋体" Font-Size="10pt" ForeColor="Navy" Width="103px" OnPreRender="CheckBoxList2_PreRender" >
            <asp:ListItem>全选</asp:ListItem>
        </asp:CheckBoxList>
        </td>
            </tr>
        </table>

.cs文件

protected void CheckBoxList2_PreRender(object sender, EventArgs e)
    {
        CheckBoxList2.Attributes.Add("onclick", "CheckAll()");
        CheckBoxList1.Attributes.Add("onclick", "CheckAlone()");
    }

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。