解决checkbox未选中不传递value
2021/12/9 6:17:04
本文主要是介绍解决checkbox未选中不传递value,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
前端解决
网上很多解决方案,我这种应该还算简单的
只需要给checkbox元素添加data-default-value="0"
表示未选中的默认值
直接使用版
<input class="form-check-input" name="top" value="1" data-default-value="0" type="checkbox" role="switch" id="top">
let data = $('.form2').serialize(); var $notchecked_obj = $('.form2 input[type=checkbox]:not(:checked)'); $notchecked_obj.each(function (index, element) { let value = $(element).attr('data-default-value'); let key = $(element).attr('name'); data += '&' + $.param({[key]: value}); }); alert(data);
稍微封装版,放公共函数里面,以后可以直接用
function formcheck(form_selector_str, serialize_data) { // 组装选择器 let selector = form_selector_str + ' input[type=checkbox]:not(:checked)'; //遍历没有选中的checkbox let $notchecked_obj = $(selector); // console.log($notchecked_obj); let temp = serialize_data; $notchecked_obj.each(function (index, element) { let value = $(element).attr('data-default-value'); let key = $(element).attr('name'); temp += '&' + $.param({[key]: value}); }); return temp; } var res = formcheck('.form2', $('.form2').serialize());
这篇关于解决checkbox未选中不传递value的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-29Elasticsearch慢查询日志配置
- 2024-05-29揭秘华为如此多成功项目的产品关键——Charter模板
- 2024-05-29海外IDC业务拓展的7大挑战
- 2024-05-29InLine Chat功能优化对标Github Copilot,CodeGeeX带来更高效、更直观的编程体验!
- 2024-05-29CodeGeeX 智能编程助手 6 项功能升级,在Visual Studio插件市场霸榜2周!
- 2024-05-29AutoMQ 生态集成 Apache Doris
- 2024-05-292024年IDC行业的深度挖掘:机遇、挑战与未来展望
- 2024-05-29五款扩展组件齐发 —— Volcano、Keda、Crane-scheduler 等,邀你体验
- 2024-05-29AutoMQ 对象存储数据高效组织的秘密: Compaction
- 2024-05-29活动预告|来 GIAC 大会听大数据降本利器:AutoMQ 基于云原生重新设计的 Kafka