jQuery前端的全选 全不选 奇数组 偶数组 的多选按钮功能

<script>                          
                            
                            $("#btn1").click(function(){  (全选)
      
                              $(".check").prop("checked","true"); //这个地方一定要写成prop形式 ,如果采用ATTR会导致只能进行一次选择,第二次选择必须刷新页面才可以
    
                             });

$("#btn2").click(function(){   (全不选)
                            
                               $(".check").removeAttr("checked"); //既然上面用了prop这地方只能用removeAttr,注意大小写格式
                            
                             });
                             
                             $("#btn3").click(function(){  (奇数选)
                            
                               $(".check").each(function(){ 
                               
                                 this.checked=false;
                               
                               })

$(".check:even").each(function(){
                               
                                 this.checked=true;
                                  
                                  
                                 })
                               
                        
                             });

$("#btn4").click(function(){  (偶数选)
                            
                                $(".check").each(function(){
                                
                                   this.checked=false;
                                
                                })

$(".check:odd").each(function(){
                                
                                    this.checked=true;
                                
                                })
                            
                             })

</script>

时间: 2024-07-31 21:57:21

jQuery前端的全选 全不选 奇数组 偶数组 的多选按钮功能的相关文章

jquery checkbox的相关操作——全选、反选、获得所有选中的checkbox

jquery checkbox的相关操作——全选.反选.获得所有选中的checkbox 1.全选 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked","true"); }) 2.取消全选(全不选) $("#btn2").click(function(){ $("input[name='checkbox']&

用jquery实现复选框全选全不选问题(完整版),在网络上怎么也找不到完整的解决方案,重要搞全了

首先准备jsp页面控件: 请选择您的爱好:<br> <input type="checkbox" id="all" name="selectAll"value="全选"/>全选<br> <input type="checkbox" name="hobby"value="足球"/>足球 <input type=&qu

利用jQuery实现CheckBox全选/全不选/反选

转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3.1.js–>测试通过,jquery-1.5.1.js–>测试不通过. 实现CheckBox全选/全不选/反选代码如下: <%@ page language="java" pageEncoding="UTF-8"%>   <!DOCTYPE

jquery实现全选/全不选

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <script src="./js/jquery.min.js"></script> </head> <body> <form action=&q

checkbox全选/全不选/反选(jQuery v1.11.3测试通过)

主要功能: 方式一:使用三个按钮(全选.全不选 .反选)控制checkbox的选择.(实际可能全选/全不选共用按钮,这里没做) 方式二:使用一个主控checkbox用于控制其他checkbox的选择状态,同时受控checkbox是否全选也反馈给主控checkbox(这里有两种方式实现).   以下代码及实现效果在jQuery v1.11.3测试通过!2015/07/18! 测试效果:   代码: <!-- ---------------------------------------------

jQuery复选框全选全不选代码

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="author" content="http://www.51texiao.cn/" /><title>jQuery复选框全选全不选代码<

jQuery使复选框一键全选/全不选

<form> 你爱好的运动是? <input type="checkbox"  id="hxy"/>全选/不全选 <br /> <input type="checkbox" name="hxy" />1 <input type="checkbox" name="hxy" />2 <input type="chec

checkbox实现全选全不选

1.jQuery实现checkbox全选全不选 <!DOCTYPE html> <head runat="server"> <title>jQuery实现CheckBox全选.全不选</title> <meta charset="utf-8"> <script src="jquery-3.1.1.min.js"></script> <script type=

多选框checkbox全选全不选和反选

在判断多选框中的某一个是否被选中时,我们可以用checked的属性 选中了就返回true,没被选中就返回false; 这是html代码: <form action="#"> <label for="hobby">爱好:</label> <label for="hobby1"> <input type="checkbox" name="hobby" id=