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 ...
随机推荐
- python3爬虫爬取煎蛋网妹纸图片(上篇)
其实之前实现过这个功能,是使用selenium模拟浏览器页面点击来完成的,但是效率实际上相对来说较低.本次以解密参数来完成爬取的过程. 首先打开煎蛋网http://jandan.net/ooxx,查看 ...
- Nginx+tomcat集群redis共享session应用方案
部署环境 主机 软件版本 192.168.88.1 nginx-1.12.2+redis-3.2.11 192.168.88.2 apache-tomcat-7.0.79 + jdk1.8 192.1 ...
- cogs 2554. [福利]可持久化线段树
题目链接 cogs 2554. [福利]可持久化线段树 题解 没有 代码 #include<cstdio> #include<cstring> #include<algo ...
- [CF392E]Deleting Substrings
“unexpected, right?”大概可以翻译成“没想到吧!” 题意:给两个序列$w_{1\cdots n}$和$v_{1\cdots n}$,你可以多次删除$w$的子串$w_{l\cdots ...
- Scala学习总结
1)将Array转化为String,toStrings()方法应该是序列化了的. scala> val args = Array("Hello", "world&q ...
- JNI之数组
Array Operations -- 数组操作 1.GetArrayLength jsize GetArrayLength(JNIEnv *env, jarray array); Returns t ...
- ORA-12537:TNS:连接关闭 -------数据库最大连接数问题
问题: 我自己用PLSQL登录实验,我也登陆不了,可是让同事实验,他一会能够登录,一会不能够登录.应用还是能够正常访问,只是PLSQL登录异常. 分析: 基于这种情况去百度,有的说是配置文件有问题,有 ...
- JavaScript数组api简单说明
1.一个数组加上另一个(一些)数组,不会修改原数组只会返回新数组 arrayObject.concat(arrayX,arrayX,......,arrayX) 2.把数组按照指定字符串分离,不会修改 ...
- python中list/tuple/dict/set的区别
序列是Python中最基本的数据结构.序列中的每个元素都分配一个数字 - 它的位置,或索引,第一个索引是0,第二个索引是1,依此类推.Python有6个序列的内置类型,但最常见的是列表list和元组t ...
- 如何用路由器改成WiFi Pineapple系统镜像网络流量
本文主要介绍利用自己现有的设备,如何制作和使用WiFi Pineapple镜像网络流量,利用DWall模块分析用户数据,然后根据自己的需求,给DWall加入了日志记录功能.最后介绍了如何防范wifi ...