form表单提交的时候,传过去的值是键值对的形式
效果展示

第一种需求,点击input的时候,input的value发生改变
$('.group-wrapper input').click(function(){
$(this).val(0); //如果上面input的默认value是1,这样就可以在点击的时候变成0
});
第二种需求,input手动添加上选中的状态,也是要改变input的value
$('.group-wrapper input').click(function(){
var status = $(this).prop('checked'); //获取当前input的状态,看是不是选中的状态
var val = status === true ? 1 : 0; //三元表达式判断input的值,选中为1.不选中为0,赋值给一个val的变量
$(this).val(val); //改变input的val
});
第三种情况,用form表单提交的时候,input没有选中的话提交不过去
$('.group-wrapper input').click(function(){
var status = $(this).prop('checked');
var val = status === true ? 1 : 0;
$(this).val(val);
});
$('.btn-primary').click(function(){ //给确定下载的按钮添加点击事件
$('.group-wrapper input').each(function(){ //找到所有的input遍历它,
if(!this.checked){
this.checked = true; //判断当前input的选中状态,没有选中的话,让他选中。
}
});
}); //这样的话就是,前面的方法是选中不选中 设置为0或1,但是又由于没选中的话form提交不过去,所以就再写一个事件,没选中的话让他选中。
第四种情况,点击确定下载,将input的name和value拼接起来
效果展示

//确定下载
$('.btn-primary').click(function(){
var inputs=$('.group-wrapper').find('input'); //找到所有的input
var _arr=''; //声明一个空的字符串
for (var i = 0; i < inputs.length; i++) { //循环遍历所有找到的input
var inputname=inputs[i].name; //将当前的input的name属性赋给一个变量
if(inputs[i].checked){ //判断当前input的选中状态
_arr += inputname + '=1&'; //选中的情况下拼接到上面声明的空的字符串上值 等于1
}else{
_arr += inputname + '=0&' //没有选中的情况下也拼接到上面声明的空的字符串上值等于0
}
}
console.log(_arr.slice(0,-1)); //截取的原因是,末尾多了一个&符号
var result = _arr.slice(0,-1);
});
form表单提交的时候,传过去的值是键值对的形式的更多相关文章
- Ajax提交Form表单及文件上传
刚刚申请下来的博客,写得第一篇.有点小激动,本人以前是一名工业3D设计师突然有些变故做上了JavaWeb开发: 前几天,发现了一些小问题.我在写后台管理页面时,需要上传一张图片.于是我就用很普通的Fo ...
- js_ajax模拟form表单提交_多文件上传_支持单个删除
需求场景: 用一个input type="file"按钮上传多张图片,可多次上传,可单独删除,最后使用ajax模拟form表单提交功能提交到指定方法中: 问题:由于只有一个file ...
- 非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json
非form表单提交的数据就要用@requestbody注解获取http传过来的值,尤其json
- Java后台使用httpclient入门HttpPost请求(form表单提交,File文件上传和传输Json数据)
一.HttpClient 简介 HttpClient 是 Apache Jakarta Common 下的子项目,用来提供高效的.最新的.功能丰富的支持 HTTP 协议的客户端编程工具包,并且它支持 ...
- js的form表单提交url传参数(包含+等特殊字符)的解决方法
方法一:(伪装form表单提交) linkredwin = function(A,B,C,D,E,F,G){ var formredwin = document.createElemen ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- Form表单提交,Ajax请求,$http请求的区别
做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...
- Django的form表单之文件上传
在生成input标签的时候可以指定input标签的类型为file类型 <!DOCTYPE html> <html lang="en"> <head&g ...
- python中前后端通信方法Ajax和ORM映射(form表单提交)
后端从数据库获取数据给到前端: 第一种方式: admin.py文件代码: @admin.route('/showList') def show(): # 获取数据库所有文章数据,得到一个个对象 res ...
随机推荐
- Idea配置文件的读取
开发过程中遇到配置文件读取问题,因此记录以后运用的到. 配置文件位置: 配置文件内容: default_size = 100 grid_size = 20 delayTime = 200 配置文件读取 ...
- svn创建分支的做法
作者:朱金灿 来源:http://blog.csdn.net/clever101 1. 首先选择你要创建分支的工作目录,如下图: 2.选择要创建分支的路径.注释以及版本,选择HEADrevision ...
- AndroidStudio EventBus报错解决方法its super classes have no public methods with the @Subscribe
首先说明,以前我用eventBus的jar包写得项目demo,前几天就写了一个EventBus的实例,这次我没用jar包,直接用gradle引用的,可是demo写完了,报错: its super cl ...
- Android 对话框黑色边框的解决
代码解决 : Dialog dialog = new Dialog(this); Window win = dialog.getWindow(); win.setBackgroundDrawableR ...
- Devexpress控件使用二:barManager
1.拖放控件 2.两种按钮显示形式 1)上面是大图标,下面是说明 a.Add → Largebutton 注:勾选 Show DesignTime enancements 才会出现Add b.添加图片 ...
- the prblem 3n+1
题目描述计算机科学中的问题通常被归类为属于某一类问题(例如,NP,不可解,递归).在这个问题中,您将分析算法的属性,该算法的分类对于所有可能的输入都是未知的. 考虑下面的算法: 1.输入n 2.输出n ...
- kissy延迟加载demo
<!doctype html><html><head> <meta charset="gbk"/> <title& ...
- [HDU5688]2016"百度之星" - 资格赛 Problem D
题目大意:给你n个字符串,如果一个字符串可以通过重新排列变成另一个字符串,则认为这两个字符串相等.每输入一个字符串,输出这个字符串和与它相等的之前出现了几次. 解题思路:我们可以用map保存一个字符串 ...
- Manacher 求最长回文子串算法
Manacher算法,是由一个叫Manacher的人在1975年发明的,可以在$O(n)$的时间复杂度里求出一个字符串中的最长回文子串. 例如这两个回文串“level”.“noon”,Manacher ...
- 紫书 习题 8-13 UVa 10570 (枚举+贪心)
我看到数据范围只有500, 第一反应枚举所有的可能,然后求出每种可能的最小次数. 但是不知道怎么求最小次数.我想的是尽量让一次交换可以让两个不在应该在的位置的数字 到原来应该在的位置的数字, 这样可以 ...