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 ...
随机推荐
- SPOJ GSS2 - Can you answer these queries II(线段树 区间修改+区间查询)(后缀和)
GSS2 - Can you answer these queries II #tree Being a completist and a simplist, kid Yang Zhe cannot ...
- mysql 获取当前日期及格式化(转)
MySQL 获取当前日期及日期格式 获取系统日期: NOW() 格式化日期: DATE_FORMAT(date, format) 注: date:时间字段,format:日期格式 select now ...
- Maven / Nexus 的用法和经验
Maven / Nexus 的用法和经验
- [Eclipse]--Error:The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path.
一段时间没用eclipse后,再去打开以前的项目,发现一打开前线标红.查看错误的时候,如下图所示: Error:The superclass "javax.servlet.http.Http ...
- 求一个整数个位数之和 Exercise06_02
import java.util.Scanner; /** * @author 冰樱梦 * 时间:2018年下半年 * 题目:求一个整数个位数之和 * */ public class Exercise ...
- Android集成友盟社会化分享功能
1. 产品概述 友盟社会化组件,可以让移动应用快速具备社会化分享.登录.评论.喜欢等功能,并提供实时.全面的社会化数据统计分析服务. 指南将会手把手教你使用社会化组件SDK,用5分钟为APP增加新浪 ...
- 【mybatis】idea中 mybatis的mapper类去找对应的mapper.xml中的方法,使用插件mybatis-plugin
idea中 mybatis的mapper类去找对应的mapper.xml中的方法,使用插件mybatis-plugin,名字可能叫Free mybatis-plugin 安装上之后,可能需要重启ide ...
- iOS 中json解析数据出现中文乱码的问题
一般服务器的编码格式都是UTF8,这样通过json解析下来的的数据,一般中文是不会出现乱码,但是如果服务器的编码格式不是UTF8,通过json解析的数据中的中文容易出现luan乱码,怎么解决这个问题呢 ...
- Task-based Asynchronous Operation in WCF z
Download source - 93.5 KB Introduction Though performance blocking and sluggishness are the tailback ...
- delphi 接口Interface
学习 delphi 接口 一切都是纸老虎!!! 第四章 接口 前不久,有位搞软件的朋友给我出了个谜语.谜面是“相亲”,让我猜一软件术语.我大约想了一分钟,猜 出谜底是“面向对象”.我 ...