jquery实现购物车的全选与反选

//获取所有的子按钮让下面的去全选按钮跟着改变
var inputs=$(‘.Item‘)
var allinput=$(‘.qxan‘)
$(".Item").click(function () {
var s = $(".Item").length;
var a = $(".Item:checked").length;
if (s == a) {
allinput.prop(‘checked‘, true);
} else {
allinput.prop(‘checked‘, false);
}
});

// 点击每一家中的商品或者店名前面的的input框时,让里面额input框也跟着改变  如下图
$(‘.diangdan‘).on(‘tap‘,‘input‘,function(){
if(this.checked){
$(this).parent().parent().siblings().children().children(‘input‘).prop("checked",false);
}else {
$(this).parent().parent().siblings().children().children(‘input‘).prop("checked", true);
}
})

//点击全选事件
$(‘.qxan‘).on(‘tap‘,function(){
if(this.checked){
$(‘.Item‘).prop("checked",false);
}else {
$(‘.Item‘).prop("checked", true);
}

})

补充说明:

中间的功能是自己按照实际的需求自己进行修改的

前两个按钮是一家店铺,并在里面所购买一种商品

最后一个为全选按钮

原文地址:https://www.cnblogs.com/Progress-/p/11451711.html

时间: 2024-10-11 10:57:43

jquery实现购物车的全选与反选的相关文章

Android中购物车的全选、反选、问题和计算价格

此Demo主要解决的是购物车中的全选,反选计算价格和选中的条目个数的问题,当选中几条时,点击反选,会把当先选中的变为不选中,把不选中的变为选中.点击全选会全部选中,再次点击时,变为全部不选中. //-----------一下为main的布局----------------------- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http

JQuery实现的 checkbox 全选、反选。

1. 全选的checkbox选中时,子checkbox全部选中.反之,全部不选 2.子checkbox中,只要有没有被选中的,取消全选checkbox的选中 3.子checkbox的数量和子checkbox被选中的数量一样时,全选checkbox要被选中 [javascript] view plain copy //复选框事件 //全选.取消全选的事件 function selectAll(){ if ($("#SelectAll").attr("checked")

jQuery实现checkbox的全选和反选

1 $(function () { 2 3 if ($(".chk_all")) { 4 5 $(".chk_all").click(function () { 6 $("input[checkname='choice']").prop("checked", $(this).prop("checked")); 7 }); 8 } 9 }); 如何使用: 1 <table > 2 <tr&g

jquery中checkbox的全选与反选

<script type="text/javascript"> 'use strict'; $(function () {  $("#c1").click(function () {     $('input[type="checkbox"]').prop("checked", this.checked)  }); }); </script> <body> <div id="

checkbox全选和反选功能

用jQuery实现checkbox的全选和反选功能,当checkbox禁用时候不参与全选功能 <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,inp

jquery checkbox的相关操作——全选、反选、获得所有选中的checkbox

jquery checkbox的相关操作——全选.反选.获得所有选中的checkbox 1.全选 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked","true"); }) 2.取消全选(全不选) $("#btn2").click(function(){ $("input[name='checkbox']&

jQuery 全选与反选时出现的bug!

今天在写项目,使用jQuery1.10.2 发现一个小小的bug, 在设置checked属性时,前两次反选的时候是正常的,后面均不正确,通过调试, 准确的说应该是只有第一次是正确的,在第二次单击时,事件快完成的时候的运行的流程有点奇怪.所以自己感觉这么 成熟的框架不应该出现这个问题,于是又将1.11.1版本下载下来,也是jQuery1的最新版本测试,同样末果,问题依 然存在,使用标准的document.getElementById, 直接设置值是没有问题的. 我本人根据测试,应该是jQuery的

利用JQuery实现全选和反选的几种方法

前面介绍了利用JavaScript实现全选功能,其中也有要注意的几点,现在讲解下在JQuery怎么实现全选和反选,下面提供了两种方法实现. 如图:要实现的效果是点击全选框全部选中,再点击全部不选中 方法一思路:1.导入jQuery库,这个网上可以下载,是免费开源的,2.设置class为fruit,通过prop设置它们的属性. 方法一:jQuery代码: 1 //定义标识,true表示选中 2 var chkall = true; 3 $(function () { 4 //全选按钮设置点击事件

jQuery实现的全选、反选和不选功能

适用于网页多选后需要进行批量操作的场景(如批量删除等).如有问题希望大家可以指正.谢谢~~ HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮 <ul id="list"> <li><label><input type="checkbox" value="1"> 1.时间都去哪儿了</label></li> <l