超超爱哭包
2021-11-30 14:36
采纳率: 20%
浏览 31
已结题

使用jquery实现复选框的全选和获取选择值得功能

使用jquery实现复选框的全选和获取选择值得功能,实现效果如下图所示:

img

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

3条回答 默认 最新

  • 嘿嘿!请多指教 2021-11-30 14:47
    最佳回答
    
    <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="UTF-8">
      
        <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
        <script type="text/javascript">
            $(function () {
                //用id选择器获取button组件,这里可以用其他选择器,如class为. id为# 等。详情看jQuery官网
                $("#selectAll").click(function () {
                    //设置选择框选中为true
                    $("input[type='checkbox']").prop("checked", true);
                });
                var aa=""; 
                $("#getVal").click(function () {
    
                    $("input[type='checkbox']:checkbox:checked").each(function(){ 
    
                        aa+=$(this).val() 
                    }) 
                })
                 console.log(aa)
            });
        </script>
    </head>
    
    <body>
    
        <input type="checkbox" value="足球"/>足球
        <input type="checkbox" value="篮球"/>篮球
        <input type="checkbox" value="羽毛球"/>羽毛球
        <input type="checkbox" value="乒乓球"/>
    
        <br>
        <input type="button" id="selectAll" value="全选">
        <input type="button" id="getVal" value="获取">
    
    </body>
    
    </html>
    
    评论
    解决 1 无用
    打赏 举报 编辑记录
查看更多回答(2条)

相关推荐 更多相似问题