Jquery全选与反选点击执行一次的解决方案
在做项目时遇到一个bug,checkbox全选与反选功能,只能点击一次,再点就不起作用了,为了解决此问题,我查找了好多资料,下面把具体解决方案整理分享给大家,需要的朋友可以参考下:
代码需求, 使用attr只能执行一次,使用prop则完美实现全选和反选,获取所有选中的项并把选中项的文本组成一个字符串。
存在bug的代码:只能全选一次就失效
$(document).ready(function(){
$("#CalculationAll").click(function(){
var ischecked = this.checked;
$("form input").each(function(){
if($(this).val()!='CalculationAll')
{
$(this).attr("checked",ischecked);//每一项都选中 attr ,这个有问题,选中一次下一次就失效
}
calculationAll();//计算购物车选中总价格
});
});
});
function calculationAll() {
count = 0;
$("form input").each(function(){
if($(this).val()!='CalculationAll')
{//过滤全选input
goodsId = $(this).val();
if(this.checked)
{
num = parseInt($("#num_"+goodsId).text());
price = parseFloat($("#price_"+goodsId).text());
count = count+(num * price);
}
}
});
$('#count').text(count.toFixed(2));
}
修正后的代码:
$(document).ready(function(){
$("#CalculationAll").click(function(){
var ischecked = this.checked;
$("form input").each(function(){
if($(this).val()!='CalculationAll')
{
$(this).prop("checked",ischecked);//选中或取消选择,做全选用
}
calculationAll();//计算选中物品的价格
});
});
});
参考:http://www.jb51.net/article/71067.htm
Jquery全选与反选点击执行一次的解决方案的更多相关文章
- JQuery 全选 反选 获取Table 中指定td的元素值
//全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...
- Jquery全选与反选checkbox(代码示例)
今天在公司要实现操作权限的功能,需要根据左边的树,选择一项,判断右边的操作权限,例如,增加,修改,删除,查看等按钮的显示与隐藏: 这个功能实现思路如下: 1.操作权限:增加.修改等按钮的ID和Text ...
- Jquery全选系列操作(锋利的jQuery)
Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...
- jQuery全选与反选,且解决点击只执行一次的问题
<html> <head> <script src="jquery-1.11.1.min.js" type="text/javascript ...
- Jquery 实现添加删除,checkbok 的全选,反全选,但是批量删除没有实现
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title& ...
- JQuery全选Prop(“check”,true)和attr("attr",true)区别
$scope.selectAll = false; //点击单选框的时候是不是全选 $scope.checkIsAll = function(){ var wipeCheckBoxObj = $(&q ...
- Jquery全选单选功能
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm6.aspx. ...
- Jquery 全选、反选问题解析
最近工作中,需要使用Jquery实现复选框的全选和反选,本人虽然不是专职撸前端的,但这个小问题感觉也没什么难度,下面直接上代码: <div id="list"> < ...
- 关于JQuery全选/反选第二次失效的问题
最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectA ...
随机推荐
- 二分图匹配【p2147】课程
Description n个学生去p个课堂,每一个学生都有自己的课堂,并且每个学生只能去一个课堂,题目要求能够安排每一个课堂都有人吗? Input 第一行是测试数据的个数, 每组测试数据的开始分别是p ...
- 几何+暴力【p1959】 遗址[NOI导刊2009普及(6)]
题目描述--> P1959 遗址_NOI导刊2009普及(6) 普通方法分析: 因为题目要求是找最大正方形(如果是长方形更麻烦. 讲真,题目不难,耗时间! 根据题目要求,我们要找的是正方形. 我 ...
- ubuntu 修改权限
在linux终端先输入ll,可以看到如: -rwx-r–r– (一共10个参数) 表示文件所属组和用户的对应权限. 第一个跟参数属于管理员,跟chmod无关,先不管. 2-4参数:属于user 5-7 ...
- [BZOJ3816][清华集训2014]矩阵变换(稳定婚姻问题)
3816: 矩阵变换 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 803 Solved: 578[Submit][Status][Discuss] ...
- 在Code First中自动创建Entity模型
之前我在博客文章中介绍过如何使用Code First来创建数据库,通过CodeFirst的方式,可以大幅的减少开发人员的工作量,比传统的先创建库再ORM的方式简单了不少.但是,很多时候,特别是一些MI ...
- winform treeview 绑定文件夹和文件
转载:http://www.cnblogs.com/zhbsh/archive/2011/05/26/2057733.html #region treeview 绑定文件夹和文件 /// <su ...
- 【InteillJ IDEA】Git的安装+同步项目到GitHub上
需要的工具: 1.InteillJ IDEA 2.Git 3.GitHub帐号 步骤: 1.下载Git 下载地址:https://git-scm.com/downloads 安装完成后 勾选Launc ...
- 使用ab.exe监测100个并发/100次请求情况下同步/异步访问数据库的性能差异
ab.exe介绍 ab.exe是apache server的一个组件,用于监测并发请求,并显示监测数据 具体使用及下载地址请参考:http://www.cnblogs.com/gossip/p/439 ...
- npm install -S -D -g 有什么区别
npm install module_name -S 即 npm install module_name --save 写入dependencies npm install modu ...
- solr6.6 配置拼音分词
参考:solr6.6 配置同义词 1.下载拼音分析包 下载地址:pinyin.zip 解压后放在core下面的lib文件夹下面: 2.修改managed-schema配置文件 <fieldTyp ...