我是一个菜鸟,我只是在努力,2021正视自己,面对2021!

使用JavaScript代码实现各种数据控件的反选功能,不要只做拖控件的菜鸟

在我们做许多项目的时候,会用到反选这个功能,但是我一般使用C#代码创建数组遍历实现功能,今天我想换一种语言实现一下,于是我就用JavaScript研究了一下怎么实现这个功能,原来也很简单和用C#语言来实现这个差不多吧,只不过使唤了两种语言哦,而且这样写代码对系统的性能也比较好。如图所示:为反选所实现的功能。

下面将实现反选的两部分代码写一下哦。控件使用的是GridView控件

<asp:TemplateField HeaderText="&lt;input type='checkbox' id='cbAll' name='cbAll' onclick='selAll(this.checked);' /&gt;反选">

    <ItemTemplate>

    <input type="checkbox" id="cbName" name="cbName" value='<%# DataBinder.Eval(Container.DataItem, "ProductID")%>' />

     </ItemTemplate>

</asp:TemplateField>

然后写JavaScript代码来实现这个功能:

<script type="text/javascript">

        function selAll(boolValue)

        {

            var obj=document.getElementsByName("cbName");

            var cbNameLen=obj.length;

            if(cbNameLen>1)

            {

                for(var i=0;i<cbNameLen;i++)

                {

                    if(obj[i].checked)

                    {

                        obj[i].checked=false;

                    }

                    else

                    {

                        obj[i].checked=true;

                    }

                }

               

            }

            else

            {

                obj.checked = boolValue;

            }

        }

       

        function clickBtnCheck()

        {

            var obj=document.getElementsByName("cbName");

            var cbNameLen=obj.length;

            var Flag=false;

            if(cbNameLen>0)

            {

                for(var i=0;i<cbNameLen;i++)

                {

                    if(obj[i].checked)

                    {

                        Flag=true;

                        break;

                    }

                }

                if(Flag)

                {

                    return true;

                }

                else

                {

                    alert("请先选择要操作的记录! ");

                    return false;

                }

            }

            else

            {

                alert("现在没有记录,不能操作!");

                return false;

            }

        }

    </script>

 

posted @   Kencery  阅读(1481)  评论(7编辑  收藏  举报
编辑推荐:
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
友情链接:初心商城
点击右上角即可分享
微信分享提示