js中复选框的取值及赋值示例详解


Posted in Javascript onOctober 18, 2020

1、复选框的取值:(js部分)

var checkboxdata = $(“input[name=payoperator]:checked”).map(function() {
return $(this).val();
}).get().join(",");
<div class="form-group">
 <label class="col-lg-2 col-md-2 col-sm-12 control-label">支付方式</label>
 <div class="col-lg-4 col-md-4">
 <label class="checkbox-inline"> 
 <input type="checkbox" name="payoperator" value="1">支付宝在线缴费 </label>
 <label class="checkbox-inline"> 
 <input type="checkbox" name="payoperator" value="2" checked="checked">支付宝代扣缴费 </label>
 <label class="checkbox-inline">
 <input type="checkbox" name="payoperator" value="3" checked="checked">支付宝当面付 </label>
 </div>
</div>

复选框中name="payoperator"必须相同,复选框才会生效

2、复选框的赋值:

从后台取到值后要先在前端页面初始化(复选框都未选中)

$(“input[name=payoperator]”).attr(“checked”,false);

var detail = detaildata.pay_operator;(detaildata为从后台取到的所有数据的值,pay_operator为数据库的字段)
 var split = detail.split(",");
  for (var i = 0; i < split.length; i++) {
  $("input[name=payoperator][value="+split[i]+"]").attr("checked","checked");
  }

       页面布局与上方的布局取值一样。

总结

到此这篇关于js中复选框的取值及赋值的文章就介绍到这了,更多相关js复选框的取值及赋值内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
IE浏览器PNG图片透明效果代码
Sep 02 Javascript
JavaScript/jQuery 表单美化插件小结
Feb 14 Javascript
node.js下when.js 的异步编程实践
Dec 03 Javascript
js鼠标滑过图片震动特效的方法
Feb 17 Javascript
jquery制作多功能轮播图插件
Apr 02 Javascript
JS+CSS实现的拖动分页效果实例
May 11 Javascript
纯JS实现图片验证码功能并兼容IE6-8(推荐)
Apr 19 Javascript
基于Bootstrap表单验证功能
Nov 17 Javascript
vue如何将v-for中的表格导出来
May 07 Javascript
Angularjs中的$apply及优化使用详解
Jul 02 Javascript
详解多页应用 Webpack4 配置优化与踩坑记录
Oct 16 Javascript
Vue中通过属性绑定为元素绑定style行内样式的实例代码
Apr 30 Javascript
如何搭建一个完整的Vue3.0+ts的项目步骤
Oct 18 #Javascript
详解如何在Javascript中使用Object.freeze()
Oct 18 #Javascript
从表单校验看JavaScript策略模式的使用详解
Oct 17 #Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
Oct 17 #Javascript
JS页面动态绘图工具SVG,Canvas,VML介简介
Oct 16 #Javascript
DWR内存兼容及无法调用问题解决方案
Oct 16 #Javascript
JS pushlet XMLAdapter适配器用法案例解析
Oct 16 #Javascript
You might like
php5 and xml示例
2006/11/22 PHP
用Json实现PHP与JavaScript间数据交换的方法详解
2013/06/20 PHP
使用PHP获取当前url路径的函数以及服务器变量
2013/06/29 PHP
PHP禁止个别IP访问网站
2013/10/30 PHP
网页开发中的容易忽略的问题 javascript HTML中的table
2009/04/15 Javascript
理解Javascript_05_原型继承原理
2010/10/13 Javascript
使用Jquery来实现可以输入值的下拉选单 雏型
2011/12/06 Javascript
php对mongodb的扩展(小试牛刀)
2012/11/11 Javascript
复制js对象方法(详解)
2013/07/08 Javascript
jQuery中filter()和find()的区别深入了解
2013/09/25 Javascript
javascript实现动态侧边栏代码
2014/02/19 Javascript
js 获取元素下面所有li的两种方法
2014/04/14 Javascript
JQuery异步获取返回值中文乱码的解决方法
2015/01/29 Javascript
移动端 一个简单易懂的弹出框
2016/07/06 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
2017/04/01 Javascript
react-native组件中NavigatorIOS和ListView结合使用的方法
2017/09/30 Javascript
javascript计算对象长度的方法
2017/10/25 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
Vue.js 中的实用工具方法【推荐】
2019/07/04 Javascript
JavaScript中的相等操作符使用详解
2019/12/21 Javascript
python DataFrame获取行数、列数、索引及第几行第几列的值方法
2018/04/08 Python
Python3.6日志Logging模块简单用法示例
2018/06/14 Python
python同时遍历数组的索引和值的实例
2018/11/15 Python
python re.sub()替换正则的匹配内容方法
2019/07/22 Python
Python帮你识破双11的套路
2019/11/11 Python
Python logging模块写入中文出现乱码
2020/05/21 Python
全球领先的鞋类零售商:The Walking Company
2016/07/21 全球购物
Spanx塑身衣官网:美国知名内衣品牌
2017/01/11 全球购物
性能测试工程师的面试题
2015/02/20 面试题
学院书画协会部门岗位职责
2013/12/01 职场文书
皮肤科医师岗位职责
2013/12/04 职场文书
酒店总经理岗位职责范本
2014/08/08 职场文书
单位计划生育责任书
2015/05/09 职场文书
使用react-virtualized实现图片动态高度长列表的问题
2021/05/28 Javascript
MySQL外键约束(FOREIGN KEY)案例讲解
2021/08/23 MySQL
动画「半妖的夜叉姬」新BD特典图公开
2022/03/22 日漫