`
liuzhiqiang19890403
  • 浏览: 61057 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

使用js判断复选框是否被选中

 
阅读更多

<html> <head>
        <title>
            复选框全选、全不选、反选、必选一个
        </title>
        <meta http-equiv="content-type" content="text/html;charset=GBK"/>
        <script language="javascript">
            //表单验证
            function check(){              
                var ids = document.getElementsByName("ids");              
                var flag = false ;              
                for(var i=0;i<ids.length;i++){
                    if(ids[i].checked){
                        flag = true ;
                        break ;
                    }
                }
                if(!flag){
                    alert("请最少选择一项!");
                    return false ;
                }
            }
            //全选
            function iselect(){ //其中函数字不能为select 其为JS保留字
                var ids = document.getElementsByName("ids");
                var all = document.getElementByIdx_x_x("all");              
                for(var i=0;i<ids.length;i++){
                    ids[i].checked=all.checked;
                }
            }
            //全选
            function selectAll(){
                var ids = document.getElementsByName("ids");                          
                for(var i=0;i<ids.length;i++){
                    ids[i].checked=true;
                }
            }
            //全不
            function selectNone(){
                var ids = document.getElementsByName("ids");                          
                for(var i=0;i<ids.length;i++){
                    ids[i].checked=false;
                }
            }
            //反选
            function selectInvert(){
                var ids = document.getElementsByName("ids");                          
                for(var i=0;i<ids.length;i++){
                    if(ids[i].checked)
                        ids[i].checked=false ;
                    else
                        ids[i].checked=true ;
                }
            }
        </script>
    </head>
    <body>
        <form action="#" onsubmit="return check();">
        <table border="0">
            <tr><td><input type="checkbox" id="all" onclick="iselect();"></td></tr>
            <tr><td><input type="checkbox" name="ids">音乐</td></tr>
            <tr><td><input type="checkbox" name="ids">短信</td></tr>
            <tr><td><input type="checkbox" name="ids">图片</td></tr>
            <tr><td><input type="checkbox" name="ids">电子书</td></tr>
            <tr><td><input type="checkbox" name="ids">铃声</td></tr>
            <tr><td><input type="checkbox" name="ids">漫画</td></tr>
            <tr><td><input type="checkbox" name="ids">游戏</td></tr>
            <tr><td><input type="checkbox" name="ids">杂志</td></tr>
            <tr><td><input type="checkbox" name="ids">新闻</td></tr>
            <tr>
                <td>
                    <a href="#" onclick="selectAll();">全选</a>&nbsp;
                    <a href="#" onclick="selectNone();">全不</a>&nbsp;
                    <a href="#" onclick="selectInvert();">反选</a>
                </td>
            </tr>
            <tr><td><input type="submit" value="提交"></td></tr>
        </table>
        </form>
    </body>
</html>

分享到:
评论

相关推荐

    使用js判断checkbox是否被选中

    js的一些功能,通过js对checkbox的操作,对select标签的操作

    循环动态判断checkbox是否被选中

    ### 循环动态判断Checkbox是否被选中 在ASP.NET Web应用程序开发中,尤其是在使用C#作为后端语言时,动态地判断一个或多个`Checkbox`控件的状态是非常常见的需求。这种需求通常出现在表单验证、用户选项设置等功能...

    JS判断单个checkbox是否被选中

    接下来,判断复选框是否被选中,我们可以通过检查其`checked`属性。如果`checked`属性为`true`,则表示复选框已被选中;如果为`false`,则表示未被选中。下面是一个示例: ```javascript if (myCheckbox.checked) {...

    jQuery如何判断checkbox(复选框)是否被选中

    在探讨如何使用jQuery判断复选框(checkbox)是否被选中的过程中,我们首先需要理解复选框的基本属性以及jQuery操作DOM元素的方式。复选框在HTML中被定义为`&lt;input type="checkbox"&gt;`,当它被选中时,其`checked`属性...

    jquery判断复选框是否被全部选中,达到全选的目的

    标题提到的“jquery判断复选框是否被全部选中,达到全选的目的”,就是针对这一需求的具体实现。下面我们将详细探讨如何利用jQuery来完成这个功能。 首先,我们需要理解jQuery库的基本用法。jQuery是一个广泛使用的...

    JS实现选中一级复选框相关二级或父级同时被选

    "JS实现选中一级复选框相关二级或父级同时被选"这个功能就是一种典型的树形结构数据的复选框关联逻辑,它涉及到JavaScript编程和DOM操作。 首先,我们需要理解这个功能的基本需求:当用户选中一级复选框时,其相关...

    BootStrap Table复选框默认选中功能的实现代码(从数据库获取到对应的状态进行判断是否为选中状态)

    本篇将详细介绍如何在Bootstrap Table中实现复选框的默认选中功能,特别地,我们将根据从数据库获取的状态来决定复选框是否被选中。 首先,我们需要引入Bootstrap Table的相关库,包括CSS和JavaScript文件。这些...

    js juqery非常好用的复选框已选中的个数统计 及 js验证码 判断表单是否有选择,没有就不提交

    非常好用的复选框已选中的个数统计 及 js验证码 判断表单是否有选择,没有就不提交。代码非常简洁,个人写网站时候常用的有力帮手,自己可以下载来按需修改,不好用你找我要分。

    判断复选框的选择状态

    在IT界,尤其是在前端开发和用户界面设计中,"判断复选框的选择状态"是一个常见的需求,主要用于实现全选和全不选的功能。这个功能在各种列表或表格中广泛使用,比如在邮件客户端中选择多封邮件,或者在电商网站上...

    js 判断checkbox是否选中的实现代码

    在使用JavaScript进行网页开发时,我们经常需要对表单元素进行操作和验证,其中checkbox(复选框)是一个常见的元素。Checkbox允许用户在多个选项中选择一个或多个选项,通过检查checkbox是否被选中,可以执行相应的...

    js判断复选框是否选中及选中个数的实现代码

    在探讨JavaScript如何实现判断复选框是否选中及其选中个数的代码之前,首先要了解复选框(Checkbox)是Web表单中常用的界面元素,它允许多选,常用于实现多选功能。开发者通常需要在用户交互时判断用户的选择情况,...

    layui默认选中table的CheckBox复选框方法

    方法一:如何根据条件判断是否默认选中table表格前面的复选框 table.render({ elem: '#userTable' , url: '../sysRole/getUserList' , title: '用户列表' , page: true //开启分页 , cols: [[ {type:'...

    JS判断是否选中checkbox

    **标题和描述**都是“JS判断是否选中checkbox”,这表明文章的主要目的是介绍如何使用JavaScript来检查一个或多个`checkbox`元素的状态(即是否被选中)。下面将详细介绍几种实现这一功能的方法,并对其进行深入解析...

    JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值

    JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值

    JavaScript简单判断复选框是否选中及取出值的方法

    接着,使用for循环遍历这个数组,通过检查每个元素的checked属性来判断复选框是否被选中。如果复选框被选中,那么我们就可以通过该元素的value属性来获取其值。 本文提供的示例代码中,定义了一个名为checkbox的...

    判断复选框是否被选中的两种方法

    在处理用户交互时,我们经常需要判断复选框是否被选中。本篇将详细介绍两种判断复选框状态的方法,这些方法在实际项目中得到了验证,非常适合开发者学习和应用。 ### 方法一:通过DOM属性检查 在JavaScript中,...

    javascript复选框实现批量选择

    点击某个复选框,如果所有复选框都选中,“全选/全不选”复选框也选中否则如果所有复选框都取消选中,“全选/全不选”复选框也取消选中: ``` function checkonebox() { if(isallchecked()) { document....

    js判断复选框是否选中的方法示例【基于jQuery】

    使用JS来判断复选框是否被选中是前端开发中的一个基础功能。而jQuery是一个快速、小巧、功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互,使得开发者能够更加高效地操作DOM。 在这篇文章...

    javascript 实现复选框全选/取消功能

    ### JavaScript 实现复选框...通过本篇文章的学习,我们了解了如何使用 JavaScript 实现复选框的全选与取消全选功能。这种功能在很多场景下都非常实用,如购物车、表格选择等。掌握这一技能有助于提高前端开发的能力。

    jquery判断checkbox(复选框)是否被选中的代码

    4. **条件判断**:正确判断复选框是否被选中的方式是 `if ($("#id").attr("checked")==true)`,而不是 `if ($("#id").attr("checked")=="true")`。因为JavaScript会将`"checked"`字符串转换为布尔值`true`,所以比较...

Global site tag (gtag.js) - Google Analytics