这是开发中常见的小功能,想当初我也曾对于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. Thinkphp5.0 视图view取值

    Thinkphp5.0 视图view取值 <!-- 获取控制器传递的变量 --> <li>{$age}</li> <!-- 获取服务器的信息 --> & ...

  2. Ubuntu12.04之SSH

    Ubuntu 12.04 关于SSH的知识 (1)安装完ubuntu系统12.04. (2)查看网络配置,输入命令ip addr后,显示有IP地址. (3)使用SSH终端工具Xshell连接系统,发现 ...

  3. Codeforces 645A Amity Assessment【八数码】

    题目链接: http://codeforces.com/problemset/problem/645/A 题意: 2*2的八数码问题 分析: 这题n为2,不需要搜索,直接判断字母排列顺序就好了. 注意 ...

  4. 洛谷——P1151 子数整数

    P1151 子数整数 题目描述 对于一个五位数a1a2a3a4a5,可将其拆分为三个子数: sub1=a1a2a3 sub2=a2a3a4 sub3=a3a4a5 例如,五位数20207可以拆分成 s ...

  5. Ubuntu 16.04安装RabbitVCS替代TortoiseSVN/TortoiseGit

    RabbitVCS官网:http://www.rabbitvcs.org/easonjim 1.添加PPA源 sudo add-apt-repository ppa:rabbitvcs/ppa 如果导 ...

  6. JSP发送电子邮件

    以下内容引用自http://wiki.jikexueyuan.com/project/jsp/sending-email.html: 发送一个简单的电子邮件 给出一个简单的例子,从机器上发送一个简单的 ...

  7. how to read openstack code : wsgi

    要读懂本篇,你至少得写过一个python的web程序,并且把它部署到web服务器上过. 什么是wsgi 假设你写了一个python的web程序,并部署到了nginx上,那么一个http request ...

  8. json数组显示格式

    {“colorAndImg”:[{"颜色":“红色”,"地址":“www.sohu.com”}, {“颜色”:“绿色,“地址”:“www.sohu.com”}] ...

  9. 旧瓶新酒之ngx_lua & fail2ban实现主动诱捕

    服务器承担着业务运行及数据存储的重要作用,因此极易成为攻击者的首要目标.如何对业务服务器的安全进行防护,及时找出针对系统的攻击,并阻断攻击,最大程度地降低主机系统安全的风险程度,是企业安全从业人员面临 ...

  10. 在Windows上安装Nexus

    在Windows上安装Nexus 学习了:https://www.cnblogs.com/yucongblog/p/6696736.html 下载地址:https://sonatype-downloa ...