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 ...
随机推荐
- hdu6086(AC 自动机)
hdu6086 题意 字符串只由 \(01\) 组成,求长度为 \(2L\) 且包含给定的 \(n\) 个子串的字符串的个数(且要求字符串满足 \(s[i] \neq s[|s| - i + 1]\) ...
- 【最短路】【spfa】小vijos P1447 Updown
小vijos P1447 Updown 背景 开启了升降梯的动力之后,探险队员们进入了升降梯运行的那条竖直的隧道,映入眼帘的是一条直通塔顶的轨道.一辆停在轨道底部的电梯.和电梯内一杆控制电梯升降的巨大 ...
- 【莫队算法】bzoj3289 Mato的文件管理
莫队算法,离线回答询问,按一定大小(sqrt(n*log(n))左右)将答案分块,按 ①左端点所在块②右端点 双关键字排序. 然后暴力转移. 转移的时候用树状数组. O(n*sqrt(n)*log(n ...
- Asp.Net MVC part1
路由简介在Global中注册了路由数据包括:默认Controller,默认Action,请求地址匹配路由规则 约定大于配置为了尽量少的配置,于是将常用的配置作为默认约定,如果不同则进行少量配置主要从存 ...
- Android 中AlarmManager升级4.2
- sping boot 入门
http://www.cnblogs.com/ityouknow/p/5662753.html http://blog.csdn.net/lxhjh/article/details/51711148 ...
- Javascript常见设计模式解析
设计模式(Design pattern)是一套被反复使用.多数人知晓的.经过分类编目的.代码设计经验的总结.使用设计模式是为了可重用代码.让代码更容易被他人理解.保证代码可靠性.毫无疑问,设计模式于己 ...
- Qemu 有用的链接
Qemu下载和编译 Download https://en.wikibooks.org/wiki/QEMU/Linux https://en.wikibooks.org/wiki/QEMU/Insta ...
- 如何使用 vimdiff 来 git diff
git config --global diff.tool vimdiffgit config --global difftool.prompt falsegit config --global al ...
- SQL 日期格式化函数
Sql Server 中一个非常强大的日期格式化函数: 获得当前系统时间,GETDATE(): 2008年01月08日 星期二 14:59 Select CONVERT(varchar(100), G ...