jQuery实现获取多选框的值示例


Posted in jQuery onFebruary 07, 2020

本文实例讲述了jQuery实现获取多选框的值。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>3water.com jQuery获取多选框的值</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  </head>
  <body>苹果:
    <input type="checkbox" name="id" value="aa">香蕉:
    <input type="checkbox" name="id" value="bb">橘子:
    <input type="checkbox" name="id" value="cc">
    <button id="btn">批量删除</button>
  </body>
  <script>
  $('#btn').click(function () {
    var id=[];
    $("input[name='id']:checked").each(function(){
      id.push($(this).val());
    });
    console.log(id);
  });
  </script>
</html>

运行效果

 jQuery实现获取多选框的值示例

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 jQuery
Jquery把获取到的input值转换成json
May 15 jQuery
jQuery自定义多选下拉框效果
Jun 19 jQuery
jQuery实现节点的追加、替换、删除、复制功能示例
Jul 11 jQuery
jQuery实现鼠标响应式淘宝动画效果示例
Feb 13 jQuery
jQuery 改变P标签文本值方法
Feb 24 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
jQuery实现验证用户登录
Dec 10 jQuery
jQuery开发仿QQ版音乐播放器
Jul 10 jQuery
jQuery实现放大镜案例
Oct 19 jQuery
jQuery实现购物车全功能
Jan 11 jQuery
jQuery操作选中select下拉框的值代码实例
Feb 07 #jQuery
如何使用Jquery动态生成二级选项列表
Feb 06 #jQuery
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 #jQuery
9种方法优化jQuery代码详解
Feb 04 #jQuery
jQuery实现小火箭返回顶部特效
Feb 03 #jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 #jQuery
Jquery Datatables的使用详解
Jan 30 #jQuery
You might like
域名查询代码公布
2006/10/09 PHP
php 调试利器debug_print_backtrace()
2012/07/23 PHP
thinkphp实现面包屑导航(当前位置)例子分享
2014/05/10 PHP
PHP递归遍历指定目录的文件并统计文件数量的方法
2015/03/24 PHP
CodeIgniter钩子用法实例详解
2016/01/20 PHP
php文件上传后端处理小技巧
2016/05/22 PHP
PHP5.0~5.6 各版本兼容性cURL文件上传功能实例分析
2018/05/11 PHP
LazyForm jQuery plugin 定制您的CheckBox Radio和Select
2009/10/24 Javascript
js或者jquery判断图片是否加载完成实现代码
2013/03/20 Javascript
JavaScript使用focus()设置焦点失败的解决方法
2014/09/03 Javascript
JavaScript中的Promise使用详解
2015/06/24 Javascript
举例讲解jQuery中可见性过滤选择器的使用
2016/04/18 Javascript
jQuery 选择同时包含两个class的元素的实现方法
2016/06/01 Javascript
js中获取时间new Date()的全面介绍
2016/06/20 Javascript
JS排序之快速排序详解
2017/04/08 Javascript
vue.js实现价格格式化的方法
2017/05/23 Javascript
关于使用js算总价的问题
2017/06/23 Javascript
js如何编写简单的ajax方法库
2017/08/02 Javascript
深入理解Vue官方文档梳理之全局API
2017/11/22 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
详解vue-cli+es6引入es5写的js(两种方法)
2019/04/19 Javascript
Python中的各种装饰器详解
2015/04/11 Python
关于Python字符编码与二进制不得不说的一些事
2020/10/04 Python
Django项目创建及管理实现流程详解
2020/10/13 Python
中国医药集团国药在线:国药网
2017/02/06 全球购物
static关键字的用法
2013/10/07 面试题
大学应届生求职简历的自我评价
2013/10/08 职场文书
企业文化口号
2014/06/12 职场文书
群众路线剖析材料范文
2014/10/09 职场文书
处级干部考察材料
2014/12/24 职场文书
医生辞职信范文
2015/03/02 职场文书
户外亲子活动总结
2015/05/08 职场文书
被委托人身份证明
2015/08/07 职场文书
煤矿安全生产管理协议书
2016/03/22 职场文书
导游词之山西祁县乔家大院
2019/10/14 职场文书
Django基础CBV装饰器和中间件
2022/03/22 Python