JQuery 多选按钮checkbox

在需要全选和选择部分的时候我们就需要多选
在这里主要介绍了具体的实现

JQuery

$(function () {
//全选或全不选
$("#allbox").click(function(){
if(this.checked){
$(":checkbox").prop("checked",true);
}else{
$(":checkbox").prop("checked",false);
}
});
//设置全选复选框
$(":checkbox").click(function(){
allchk();
});
});
function allchk(){
var chknum = $(".item:checkbox").size();//选项总个数
var chk = $(".item:checkbox:checked").size();

if(chknum==chk){//全选
$("#allbox").attr("checked",true);
}else{//不全选
$("#allbox").attr("checked",false);
}
}

//获取选中的数据
var valArr = new Array;
$(".item:checkbox[checked]").each(function(i){
valArr[i] = $(this).val();
});
var vals = valArr.join(',');//vals就是checkbox的值,每个值以,隔开

JQuery 多选按钮checkbox的更多相关文章

  1. 表单美化-原生javascript和jQuery多选按钮(兼容IE6)

    前些天我们讲了下单选按钮的美化今天来做表单元素多选按钮的美化.我们的想法是:利用多选按钮是否被选中和是否不给选择的特性来为按钮的父元素添加对应的样式,就是说用什么的样式是由按钮的状态来决定. 用到的图 ...

  2. 多选按钮CheckBox

    main.xml: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmln ...

  3. jQuery全选/反选checkbox

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. jquery复选框checkbox实现删除

    实现这样一个基本需求,页面有很多数据,可以删除一条或多条,删除前判断是否选中至少一条,否则提示. function deleteUser() { //当时是想把内容以str+="" ...

  5. jquery 多选框 checkbox 获取选中的框

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. cocos2d-x JS 复选按钮checkBox的单选与多选

    var HZ_createRoom = jx.BaseView.extend({//红中麻将 ctor : function() { this._super(); this.addLayout(res ...

  7. zepto全选按钮之全选会根据按钮是否被全部选中更改状态

    在做手机端二次开发购物车的时候,发现zepto全选,没找到,或者功能不是自己想要的 后来做好,分享给需要的人 //全选或多选处理      var CheckAll = $('#items_check ...

  8. Android开发 ---基本UI组件2:图像按钮、单选按钮监听、多选按钮监听、开关

    Android开发 ---基本UI组件2 1.activity_main.xml 描述: 定义一个按钮 <?xml version="1.0" encoding=" ...

  9. 『心善渊』Selenium3.0基础 — 14、Selenium对单选和多选按钮的操作

    目录 1.页面中的单选按钮和多选按钮 2.判断按钮是否选中is_selected() 3.单选按钮的操作 4.多选按钮的操作 5.选择部分多选按钮的操作 1.页面中的单选按钮和多选按钮 页面中的单选按 ...

随机推荐

  1. 3、XCode: 如何添加自定义代码片段

    我们经常会定义一些retain的property,而且大概每次我们都会像这样写: @property (nonatomic, retain) Type *name; 每次都要老老实实的把“@prope ...

  2. incomplete type is not allowed

    keil环境下,报错#70: incomplete type is not allowed,解决 mqtt_conf.h 定义了一个结构体 mqtt_buffer.h #include <std ...

  3. C# 常用接口学习 ICollection<T>

    C# 常用接口学习 ICollection<T> 作者:乌龙哈里 时间:2015-11-01 平台:Window7 64bit,Visual Studio Community 2015 参 ...

  4. redis8--数据持久化两种方式

    持久化功能redis为了内部数据的安全考虑,会把本身的数据以文件形式保存到硬盘中一份,在服务器重启之后会把硬盘中的数据恢复到内存(redis)的里边.数据保存到硬盘的过程就称为"持久化&qu ...

  5. 关于java web开发需要哪些技术要求(简单的web界面管理系统)

    目前, 国内外信息化建设已经进入基于Web应用为核心的阶段, Java作为应用于网络的最好语言,前景无限看好.然而,就算用Java建造一个不是很烦琐的web应用,也不是件轻松的事情.概括一下,实施Ja ...

  6. EventBus消息机制在Eclipse环境下的使用

    1.在onStart()方法中注册 @Override public void onStart() { super.onStart(); // 注册 EventBus // 判断 Eventbus 是 ...

  7. 关于STM32的IO口速率问题

    输入模式可以不用配置速度,但是输出模式必须确定最大输出频率.当STM32的GPIO端口设置为输出模式时,有三种速度可以选择:2MHz.10MHz和50MHz,这个速度是指I/O口驱动电路的速度,是用来 ...

  8. tomcat识别不出maven web项目

    解决办法: 点中项目-->Properties-->project facets 勾选:Dynamic Web Module.java.javaScript Apply-->OK 解 ...

  9. 为Github项目创建文档

    有两种编写方式: In reStructuredText In Markdown In reStructuredText  工具:  pip install sphinx sphinx-autobui ...

  10. 博客word测试

    博客word测试 博客word测试 from __future__ import division, print_functionDOCLINES = (__doc__ or '').split(&q ...