遇到问题背景:

在写到购物车的全选交互的时候,商品选中的状态只有在第一次的时候可以,第二次就无法选中;(代码如下)

$(".chooseall").click(function(){
if($(".chooseall").attr("checked") == true){
$("input[name='checkbox1']").attr("checked", false);
console.log(1);
}else{
$("input[name='checkbox1']").attr("checked", false);
console.log(2);
}
});

解决方案:

将上述代码中的attr换成prop

$(".chooseall").click(function(){
if($(".chooseall").prop("checked") == true){
$("input[name='checkbox1']").prop("checked", false);
console.log(1);
}else{
$("input[name='checkbox1']").prop("checked", false);
console.log(2);
}
});

问题出现的原因(jQuery中attr和prop的区别):

prop读取属性值:读取已赋值的固有属性会得到属性值,读取未赋值的固有属性会得到属性默认值,读取自定义属性时无论是否赋值均得到undefine。 
prop设置属性值:prop只能设置固有属性值。 
attr读取属性值:无论是固有属性还是自定义属性,attr只能读取元素中已有的属性值,读取元素中没有的属性值会返回undefine。 
attr设置属性值:attr可以对任意属性设置属性值。

详细解释:http://blog.csdn.net/xiaouncle/article/details/53959496

write by:tuantuan

jquery checkbox 全选反选代码只能执行一遍,第二次就失败的更多相关文章

  1. 新版本的jquery checkbox 全选反选代码只能执行一遍,第二次就失败attr与prop区别

    $("#all_check").click(function() { $("input[name='checkShop[]']").attr("che ...

  2. jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次

    jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 >>>>>&g ...

  3. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  4. 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理

    近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...

  5. 表单javascript checkbox全选 反选 全不选

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  6. jquery、js操作checkbox全选反选

    全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...

  7. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  8. jquery 实现全选反选

    jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...

  9. jquery实现全选/反选功能

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

随机推荐

  1. 那些年原生js实现的楼层跳转

    最近做一个需求~~楼层跳转(京东.淘宝侧边导航),由于现在项目都用框架,所以 jquery是不能再用了,只好自己原生写一个,其实实现起来很简单,无非就是获取到每个楼层距离文档顶部的距离,然后通过控制滚 ...

  2. 教你用.Net来玩微信跳一跳

    目前开发的所有代码都已经上传到了GitHub.欢迎大家来Star https://github.com/GiantLiu/AutoJump 目前程序分为“全自动版本”和“半自动版本” 全自动版本 We ...

  3. 名片管理系统v1.1(tools)

    cords_list = []def show_cords(): print("*"*80) print("欢迎使用[名片管理系统]v.1.1") print( ...

  4. 10 - JavaSE之网络编程

    网络编程 网络通信协议分层思想 为什么要分层呢?因为整个网络协议非常复杂,要涉及到方方面面的知识,而且还有对底层硬件的操作,利用分层的思想,我们可以将复杂的通信协议分割成一层层的形式,上一层可以调用下 ...

  5. 【请您听我说】PHP语法特点的一些看法

    一.基本认识 PHP是干什么的?百度百科上提到说:PHP就是一门脚本语言,开发用的,相信这个你们只要去搜一下,就会有一大堆关于PHP概念的解释. 相信我们对PHP的初步认识是从浏览器开始的吧,当我们每 ...

  6. 图的存储结构的实现(C/C++实现)

    存档: #include <stdio.h> #include <stdlib.h> #define maxv 10 #define max 10 typedef char e ...

  7. 2017广东工业大学程序设计竞赛初赛 题解&源码(A,水 B,数学 C,二分 D,枚举 E,dp F,思维题 G,字符串处理 H,枚举)

    Problem A: An easy problem Description Peter Manson owned a small house in an obscure street. It was ...

  8. Codeforces 789A Anastasia and pebbles(数学,思维题)

    A. Anastasia and pebbles time limit per test:1 second memory limit per test:256 megabytes input:stan ...

  9. BZOJ 1012: [JSOI2008]最大数maxnumber【线段树单点更新求最值,单调队列,多解】

    1012: [JSOI2008]最大数maxnumber Time Limit: 3 Sec  Memory Limit: 162 MBSubmit: 10374  Solved: 4535[Subm ...

  10. hdu_2030

    一个小小知识点,统计字符串中汉字出现的次数,直接给出代码 //ASCII码的范围是0-127所以,超出范围的都是汉字,因为一个汉字占两个字符位置,所以结果除以2就可以了 #include<cst ...