这是开发中常见的小功能,想当初我也曾对于attr和prop的不了解踩过坑。
  前端工作中,常常会使用到select复选框,select复选框有一个属性checked,当使用js或者jquery控制这个属性的时候,我们会发现有时候设置attr(‘checked’)并没有效果,可是代码明明没有问题。这时候我们应该来聊聊attr了,attr相当于getAttribute,只能操作页面上存在的属性,当复选框没有被选中时,页面上是没有checked的这个属性的,因此attr操作无效。还有一个操作属性的方法prop(),可以操作页面上没有显示的属性。
$("#check_all").click(function(){
if($(this).is(":checked")){
$(".ck").prop("checked", 'true');
}else{
$(".ck").removeAttr("checked");
}
});
注意:这里如果将prop改成attr结果只能实现一次全选和取消,
.attr(“”)相当于elem.getAttribute(),如果也页面中没有明确表明属性和属性值用这个是取不到的;
.prop(“”)相当于elem.属性名,可操作内存中的属性值。

checkbox全选和取消功能的更多相关文章

  1. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  2. checkbox 全选或取消

    Html: 点击label 也能 check <div class="checkbox">                        <input class ...

  3. bootstrap实现checkbox全选、取消全选

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 最新版本的 ...

  4. JS对checkbox全选和取消全选

    需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...

  5. CheckBox全选、取消全选

    关于CheckBox全选取消全选 //全选 $("#SysAllSelectedID").click(function () { $("[name=SysCheckbox ...

  6. datagridview里面的checkbox全选和取消全选

    全选 设置全选button,选中所有的checkbox private void selectAll_Click(object sender, EventArgs e) { //遍历datagridv ...

  7. Jquery中对checkbox的各种“全选”或者“取消”功能实现(特别注意1.6+的一定不能使用attr来取属性了!用prop!)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. JS 某一区域内所有CheckBox全选和取消全选(.net)

    假设在某个table中的两个td,一个放全选checkbox,一个放所有的checkbox[其他标签类似] eg:        <td>人才类别:<asp:CheckBox ID= ...

  9. checkbox 全选和取消

    //全选 $("#checkall").click(function () { if (this.checked) { //如果当前点击的多选框被选中 $('input[type= ...

随机推荐

  1. cdq分治入门--BZOJ3262: 陌上花开

    n<=100000个人,每个人三个属性Ai,Bi,Ci,一个人i的等级为Ai>=Aj,Bi>=Bj,Ci>=Cj的人数,求每个等级有多少人. 裸的三维偏序.按照常规思路,一维排 ...

  2. Gym100812 L 扩展欧几里得

    L. Knights without Fear and Reproach time limit per test 2.0 s memory limit per test 256 MB input st ...

  3. 深入理解hadoop(一)

    hadoop 前世今生  hadoop最早起源于开源收缩引擎nutch,由dong cutting 贡献,但由于nutch最初的设计不能解决数10亿级别的文件存储和索引而遇到了严重的可扩展性问题,直到 ...

  4. cogs——619. [金陵中学2007] 传话

    619. [金陵中学2007] 传话 ★★   输入文件:messagez.in   输出文件:messagez.out   简单对比时间限制:1 s   内存限制:128 MB [问题描述] 兴趣小 ...

  5. Ubuntu 16.04安装JMeter测试工具

    JMeter是Java的测试工具,由Apache开发. 同样,JMeter是跨平台的. 下载: http://jmeter.apache.org/download_jmeter.cgi 安装: 7z ...

  6. tomcat8.5.20配置https

    一.使用cmd下生成证书: d: cd d:/java/jdk/jdk1.8 keytool -v -genkey -alias tomcat -keyalg RSA -keystore D:\jav ...

  7. springboot整体介绍

    1.springboot:快速开发,强大的运维能力.(监控,服务发现,并打) 2.微服务,将一个大系统分解成很多独立的小服务,这些服务能随时发布. 3.2004年第一版spring 1.0,rod j ...

  8. php文件上传判断类型

    上传文件对象在$_FILES['Filedata']对象中,临时路径是tmp_name,判断是上传文件是否为真实图片方法很多,我用的是这个: if( !@getimagesize( $_FILES[' ...

  9. 魔兽争霸3 冰封王座 w3g文件如何打开

    w3g文件怎么样才能看??? 满意回答 检举|2011-11-10 11:23 你应该是玩魔兽争霸的吧,如果是就找到你魔兽安装文件夹里面有个replay的文件夹,把w3g格式的文件放入该文件夹,再进入 ...

  10. cocos2dx-3.0(21) 移植android平台 说多了都是泪

    ----我的生活,我的点点滴滴! ! 网上3.0的教程真心少.能够说没有吧,大多都是2.x 或者 3.0測试版之类的,因为我心大,没有照着2.x去搞,后来搞完后总结了一下,发觉事实上3.0的移植and ...