20150620复选框的全选和反选

html=======

<div class="demo1">
    <h5><input type="checkbox" id="all" /><label>全选选项</label></h5>
    <p><input type="checkbox" name="item" /><label>选项(一)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(二)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(三)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(四)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(五)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(六)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(七)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(八)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(九)</label></p>
    <p><input type="checkbox" name="item" /><label>选项(十)</label></p>
</div>

js===========

var input=document.getElementsByName(‘item‘);
console.log(input.length);
var all=document.getElementById(‘all‘);
all.onclick=function (arguments) {
    for (var i = 0; i < input.length; i++) {
        if(input[i].checked){
            input[i].checked=false;
        }else{
            input[i].checked=true;
        }
    }
}
时间: 2024-12-24 11:48:49

20150620复选框的全选和反选的相关文章

jQuery学习(五)——使用JQ完成复选框的全选和全不选

1.在系统后台进行人员管理时,进行批量删除,使用jq完成全选和全不选 步骤分析: 第一步:引入jquery文件 第二步:书写页面加载函数 第三步:为上面的复选框绑定单击事件 第四步:将下面所有的复选框的选中状态设置成跟上面的一致! 2.具体代码实现: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>使用jQuery完成复选框的全选和全不

复选框的全选(引自锋利的jQuery)

1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta name="generator" content="text/html" charset="utf-8" /> 5 <title>复选框组的全选/非全选</title> 6 <script

如何实现复选框的全选和取消全选效果

如何实现复选框的全选和取消全选效果:在很多网站都有这样的功能,当点击一个全选按钮之后,所有的复选框都会被选中,再点击之后会取消全选,功能非常的人性化,可以省却很多人力,下面就简单介绍一下JS如何实现此功能,代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://ww

原生js实现的复选框的全选和全不选效果

原生js实现的复选框的全选和全不选效果:使用jquery实现复选框的全选和全部选效果非常的简单,这里就不介绍了,具体可以参阅jQuery实现的checkbox复选框全选和全不选效果一章节,下面介绍一下如何使用原生javascript实现此效果,代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" conten

js实现复选框的全选、全不选、反选

js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org

jQuery实现复选框的全选、反选、并且根据复选框的&lt;checked属性&gt;控制多个对应div的显示/隐藏

<!doctype html><html> <head> <meta charset="utf-8"> <title>jQuery实现复选框的全选.反选.并且根据复选框的(checked属性)控制多个对应div的显示/隐藏</title> <script type="text/javascript" src="jquery-1.11.3.min.js"></

js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false

用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种方式使<input type="checkbox" />中的复选框被选中. 方法一:直接在HTML行间中添加checked属性.   eg:<input type="checkbox" checked /> 方法二:使用javascript使in

JS如何实现对name是数组的复选框的全选和反选以及取消选择

JS如何实现对name是数组的复选框的全选和反选以及取消选择? form内容如下: 因为PHP接收要用 数组形式的 复选框,正常情况下 JQ可如果是这种 直接使用 $("input[name=ptpt])即可.但是这种php接收的只是最后一个值,字符串.<label><input type='checkbox' name='ptpt' value='a1' />a1</label><label><input type='checkbox' n

JavaScript - 复选框的全选和取消

复选框的全选和取消 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&

用Jquery实现复选框的全选

<html><head> <title>用Jquery实现复选框的全选</title> <script src="../javascript/jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(function () { $(function() { $("#checkAll").cli