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 相关文章推荐
项目实践之javascript技巧
Dec 06 Javascript
js给dropdownlist添加选项的小例子
Mar 04 Javascript
JS控制输入框内字符串长度
May 21 Javascript
JQuery中attr方法和removeAttr方法用法实例
May 18 Javascript
JavaScript检测并限制复选框选中个数的方法
Aug 12 Javascript
jQuery.uploadify文件上传组件实例讲解
Sep 23 Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 Javascript
JavaScript的事件机制详解
Jan 17 Javascript
Vue2.5通过json文件读取数据的方法
Feb 27 Javascript
node基于async/await对mysql进行封装
Jun 20 Javascript
浅谈vue 组件中的setInterval方法和window的不同
Jul 30 Javascript
javascript实现滚轮轮播图片
Dec 13 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
PHP iconv 函数转gb2312的bug解决方法
2009/10/11 PHP
php获取url字符串截取路径的文件名和扩展名的函数
2010/01/22 PHP
php gd2 上传图片/文字水印/图片水印/等比例缩略图/实现代码
2010/05/15 PHP
yii上传文件或图片实例
2014/04/01 PHP
thinkPHP框架对接支付宝即时到账接口回调操作示例
2016/11/14 PHP
PHP简单实现解析xml为数组的方法
2018/05/02 PHP
彻底搞懂JS无缝滚动代码
2007/01/03 Javascript
javascript iframe中打开文件,并检测iframe存在否
2008/12/28 Javascript
JavaScript 字符串与数组转换函数[不用split与join]
2009/12/13 Javascript
Array栈方法和队列方法的特点说明
2014/01/24 Javascript
node.js 开发指南 ? Node.js 连接 MySQL 并进行数据库操作
2014/07/29 Javascript
js实现按Ctrl+Enter发送效果
2014/09/18 Javascript
JavaScript 作用域链解析
2014/11/13 Javascript
jQuery基于muipicker实现仿ios时间选择
2016/02/22 Javascript
JS实现iframe编辑器光标位置插入内容的方法(兼容IE和Firefox)
2016/06/24 Javascript
微信小程序 flex实现导航实例详解
2017/04/26 Javascript
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
2017/06/20 Javascript
关于Angularjs中跨域设置白名单问题
2018/04/17 Javascript
r.js来合并压缩css文件的示例
2018/04/26 Javascript
vue 属性拦截实现双向绑定的实例代码
2018/10/24 Javascript
微信小程序生成海报分享朋友圈的实现方法
2019/05/06 Javascript
element-ui 中使用upload多文件上传只请求一次接口
2019/07/19 Javascript
深入理解 TypeScript Reflect Metadata
2019/12/12 Javascript
谈一谈vue请求数据放在created好还是mounted里好
2020/07/27 Javascript
JavaScript事件循环及宏任务微任务原理解析
2020/09/02 Javascript
Python实现的生成自我描述脚本分享(很有意思的程序)
2014/07/18 Python
Python标准库之循环器(itertools)介绍
2014/11/25 Python
python如何让类支持比较运算
2018/03/20 Python
python安装virtualenv虚拟环境步骤图文详解
2019/09/18 Python
Pandas+Matplotlib 箱式图异常值分析示例
2019/12/09 Python
python中前缀运算符 *和 **的用法示例详解
2020/05/28 Python
python如何查看网页代码
2020/06/07 Python
对python pandas中 inplace 参数的理解
2020/06/27 Python
运动会通讯稿300字
2014/02/02 职场文书
办理收楼委托书范本
2014/10/09 职场文书
2015年企业员工工作总结范文
2015/05/21 职场文书