//html代码
<input type="checkbox" id= 'all' value="全选"> 选择全部 一键上路 <input type="button" value="反选" id= 'agnSel'> <div id="wrap_input_box" >
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
<input type="checkbox">全选与反选$<br>
</div>
//  jquery代码
var oInput = $('#wrap_input_box>input[type=checkbox]')
var btn = $("#all");
btn.click(function(){
if(this.checked){
for(var i = 0 ; i<oInput.length;i++){
oInput[i].checked = true;
}
}else{
for(var i = 0 ; i<oInput.length;i++){
oInput[i].checked = false;
}
}
})
// jquery绑定函数的方式 实际上就是给他包含的每一个dom对象都绑定了此事件
oInput.click(function(){
var flag = true;
oInput.each(function(){
//当前的是否没有被选中 如果每一个都选了 那么这个flag值 将会不会改变
if(!this.checked){
flag = false;
}
});
console.log(flag);
if(flag){
btn.attr('checked',true);
}else{
btn.attr('checked',false);
}
}) //反选
$('#agnSel').click(function(){ for(i=0;i<oInput.length;i++){
oInput[i].checked= oInput[i].checked? false:true;
}
})

jQuery入门简单实现反选与全选的更多相关文章

  1. vue 入门 ------简单购物车功能实现(全选,数量加减,价格加减)

    简易购物车功能(无任何布局 主要是功能) 数量的加减 商品的总价钱 全选与全不选 删除(全选.价格 受影响) <script src="https://cdn.jsdelivr.net ...

  2. springMvc接收ajax数组参数,以及jquery复选框选中、反选、全选、全不选

    一.复选框选中.反选.全选.全不选 html代码: <input type='checkbox' name='menuCheckBox' value='10' >苹果 <input ...

  3. Day14 Javascript 点击添加出弹窗,取消隐藏弹窗小练习 反选,全选,取消边框

    点击添加出弹窗,取消隐藏弹窗小练习 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  4. 简单的jquery表单验证+添加+删除+全选/反选

    //布局 <body> <h4><a href="#">首页</a>><a href="#"> ...

  5. jquery checkbox选中状态以及实现全选反选

    jquery1.6以下版本获取checkbox的选中状态: $('.ck').attr('checked'); $('.ck').attr('checked',true);//全选 $('.ck'). ...

  6. 简单的js反选,全选,全不选

    <html> <head> <base href="<%=basePath%>"> <title>My JSP 'che ...

  7. vue 选择之单选,多选,反选,全选,反选

    1.单选 当我们用v-for渲染一组数据的时候,我们可以带上index以便区分他们我们这里利用这个index来简单地实现单选. <li v-for="(item,index) in r ...

  8. jQuery实现Checkbox中项目开发全选全不选的使用

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  9. 11.8 开课二个月零四天 (Jquery取属性值,做全选,去空格)

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

随机推荐

  1. npm全局安装失效修复

    一.windows下 先查看npm包的默认安装目录 npm config get prefix 修改配置 npm config set prefix "nodeJs的安装目录" 二 ...

  2. 配合sublime使用flexible.js实现微信开发页面自适应

    什么是flexible.js 是一个终端设备适配的解决方案.也就是说它可以让你在不同的终端设备中实现页面适配. 是一个用来适配移动端的javascript框架.根据宽度的不同设置不同的字体大小,样式间 ...

  3. [算法练习]Two Sum

    题目说明: Given an array of integers, return indices of the two numbers such that they add up to a speci ...

  4. TextSwitcher(文本切换器)和ViewFlipper

    1.TextSwitcher 使用: 应用分为三步: 1.得到 TextSwitcher 实例对象   TextSwitcher switcher = (TextSwitcher) findViewB ...

  5. JAVA环境变量安装

    需配置的系统环境变量参数: JAVA_HOME:C:\Program Files\Java\jdk1.8.0_60 CLASS_PATH: ;%JAVA_HOME%\lib;%JAVA_HOME%\l ...

  6. Hyper-V复制

    Hyper-V复制: 默认HV01上的所有虚机都被复制到HV02的 Hyper-V Replica 目录下.虚机启用复制后,当需要启用虚机副本时,要先在HV01上把原虚机关机,然后在HV02上选择故障 ...

  7. mysql io过高

    背景: 晚上,公司业务群里发信息说,有玩家在游戏里面赠送别人礼物后,赠送记录在20多分钟以后才出现,延时太高. 问题: 公司数据库使用mysql,配置了主从.配置的是,游戏程序写数据到主库,读数据到从 ...

  8. February 6 2017 Week 6 Monday

    There are no shortcuts to any place worth going. 任何值得去的地方,都没有捷径. Several years ago, I climbed the Hu ...

  9. 使用jMeter构造逻辑上有依赖关系的一系列并发请求

    相信前端开发工程师对CSRF(Cross-site request forgery)跨站请求伪造这个概念都非常熟悉,有的时候也简写成XSRF,是一种对网站的恶意利用. 尽管听起来像跨站脚本(XSS), ...

  10. 使用BAPISDORDER_GETDETAILEDLIST创建S/4HANA的Outbound Delivery

    要在S/4HANA里创建Outbound Delivery,首先要具有一个销售订单,ID为376,通过事务码VA03查看. 只用61行代码就能实现基于这个Sales Order去创建对应的outbou ...