<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Jquery复选框练习</title>
<!-- 引入jQuery，引入你自己的jQuery文件 -->
<script type="text/javascript" src="jquery.min.js" ></script>
</head>
<body>
<div>
<p>选择要购买的水果</p>
<ul id="fruit">
<li><input type="checkbox" name='message' value="001"/>苹果</li>
<li><input type="checkbox" name='message' value="002"/>雪梨</li>
<li><input type="checkbox" name='message' value="003"/>芒果</li>
<li><input type="checkbox" name='message' value="004"/>菠萝</li>
</ul>
<input type="checkbox" id="All"/>
<button id="checkAll">全选</button>
<button id="nothing">全不选</button>
<button id="reverseAll">反选</button>
<button class="chooseFruit">购买</button>

<script type="text/javascript">

<!-- 选择全部/全不选 -->
$("#All").click(function(){
if("this.checked"){
$("#fruit :checkbox").prop("checked", true);
}else{
$("#fruit :checkbox").prop("checked", false);
}
});

<!--选择全部-->
$("#checkAll").click(function(){
$("#fruit :checkbox").prop("checked", true);
});

<!--全不选-->
$("#nothing").click(function(){
$("#fruit :checkbox").prop("checked", false);
});

<!--反选-->
$("#reverseAll").click(function(){
$("#fruit :checkbox").each(function(i){
$(this).prop("checked", !$(this).prop("checked"));
});
});

<!--获取选中复选框的值-->
$(".chooseFruit").click(function(){
var arr = new Array();
$("#fruit input:checkbox[name='message']:checked").each(function(i){
arr[i] = $(this).val();
});
var vals = arr.join(",");
console.log(vals,222);
});
</script>
</div>
</body>
</html>

jQuery实现获取选中复选框的值的更多相关文章

  1. jQuery - 选中复选框则弹出提示框

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

  2. jquery：获取checked复选框的问题

    jquery:获取checked复选框的问题 功能描述:要完成一个全选的功能,但总是获取不到复选框的被选中的个数,究其原因,是Jquery中length和checked使用不当所造成的. // 获取所 ...

  3. 自动化测试selenium(四)check，选中复选框，操作一组元素

    定位复选框位置 打开浏览器,按F12,审查元素 接下来,我们要实现选中复选框 List<WebElement> inputs = driver.findElements(By.tagNam ...

  4. js&jquery 获取select下拉框的值、文本内容、自定义属性

      js&jquery 获取select下拉框的值.文本内容.自定义属性 CreationTime--2018年7月2日09点22分 Author:Marydon html <selec ...

  5. 微信小程序-form表单-获取用户输入文本框的值

    微信小程序-form表单-获取用户输入文本框的值 <input name='formnickname' class="textarea" placeholder=" ...

  6. Jquery怎么获取select选中项 自定义属性的值

    Jquery如何获取select选中项 自定义属性的值?HTML code <select id="ddl" onchange="ddl_change(this)& ...

  7. 获取jsp选中复选框的id传到后台controller，进行逻辑删除等操作

    逻辑删除设备:(数据表中还有这条记录,不显示出来) 思路: 数据表加个字段display,值为Y/N,只显示display为Y的,删除时,把display的值改为N,就不会显示出来 jsp页面如下图, ...

  8. JS实现页面table鼠标移动改变tr行颜色，单击tr选中复选框功能

    JS源代码: //需要设置tr背景颜色 var highlightcolor='#bfecfc'; //设置背景颜色 function changeto(index){ var tr1 = docum ...

  9. JQuery实现获取多个input输入框的值，并存放在一个数组中

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

随机推荐

  1. 013_实践HTTP206状态:部分内容和范围请求

    HTTP 2xx范围内的状态码表明了:"客户端发送的请求已经被服务器接受并且被成功处理了".HTTP/1.1 200 OK是HTTP请求成功后的标准响应,当你在浏览器中打开www. ...

  2. Linux实战教学笔记49：Zabbix监控平台3.2.4（一）搭建部署与概述

    https://www.cnblogs.com/chensiqiqi/p/9162986.html 一,Zabbix架构 zabbix 是一个基于 WEB 界面的提供分布式系统监视以及网络监视功能的企 ...

  3. Vultr CentOS 7 安装 Docker

    前言 最近在梳理公司的架构,想用 VPS 先做一些测试,然后就开始踩坑了!我用 Vultr 新买了个 VPS. 安装的 CentOS 版本: [root@dbn-seattle ~]# cat /et ...

  4. windows下redis安装及配置

    1.简介: redis是一个高性能的key-value数据库:redis能读的速度为11万次/秒,写的速度是8.1万次/秒 redis支持丰富的数据类型:String, List, Hash(map) ...

  5. Scrapy命令行详解

    官方文档:https://doc.scrapy.org/en/latest/ Global commands: startproject genspider settings runspider sh ...

  6. 菜鸟学习计划浅谈之Linux系统

    人这一生都是在不断地学习,不断地进步中度过的,刚开始学习任何一门知识的时候,我们都习惯性的称自己为菜鸟,觉得自己对这方面的知识欠缺,水平很low,我也是如此.但我擅长总结,对于自己学习的新知识,总结学 ...

  7. Unit 4.css的导入方式和选择器

    一.什么是css CSS是指层叠样式表(Cascading Style Sheets),样式定义如何显示HTML元素,样式通常又会存在于样式表中.也就是说把HTML元素的样式都统一收集起来写在一个地方 ...

  8. NOIP2001提高组复赛B 数的划分

    题目链接:https://ac.nowcoder.com/acm/contest/249/B 题目大意: 略 分析1(记忆化搜索): 方法为减而治之,把n划分成k份的答案就相当于每次把n分成a,b两个 ...

  9. monkey日志管理

    日志管理作用 Monkey日志管理是Monkey测试中非常重要的一个环节,通过日志管理分析,可以获取当前测试对象在测试过程中是否会发生异常,以及发生的概率,同时还可以获取对应的错误信息,帮助开发定位和 ...

  10. OTZ%%%子谦。大佬

    又上了节课...俩题 计算系数    组合数问题... 要不是大佬指点就只能阶乘暴力算了 (主要还是我忘了杨辉三角) 杨辉三角与组合数C有着千丝万缕的联系,在计算,使用方面相当方便. 先说计算系数 计 ...