Json实现传值到后台代码实例


Posted in Javascript onJune 30, 2020

1.定义一个键值对对象

function ObjData(key,value){
this.Key=key;
this.Value=value;
}

2.在点击表单的提交buttom的方法中:

var list=document.getElementById("myForm").getElementsByTagName("input");//查询form下的所有input标签
var array=[]; //定义一个对象数据 存放每一个input的键值对(input中“name”为key,“value”为value)
 
for(var i=0;i<list.length && list[i];i++) //对表单中所有的input进行遍历
{
   //判断不是空的 input,进行表单提交 
   if(list[i].value!="" || list[i].value!=null)  
   {
   
      var key=list[i].name;
      var value=list[i].value;
      var s=new ObjData(key,value); //创建键值对象
      array.push(s); //把对象放入对象数组中
   }
}

3.把数组转换成json字符串

var postData = JSON.stringify(array);

4.使用ajax提交数据

//get是通过地址栏传参数
 $.ajax({
        url :'<%=basePath%>sysparam/editForm.do?postData='+postData, 
        cache : false,
        type : "get",
        datatype : "json",
        contentType : "application/json",
        data : {postData:postData},
        success : function(data)
        {
        if(data=="1"){
//根据后台返回值确定是否操作成功
}
        }
 });

5.java后端使用request拿到json数据

String ds = request.getParameter("postData");
JSONArray json=JSONArray.fromObject(ds); //使用net.sf.json.JSONObject对象来解析json
JSONObject jsonOne;
Map<String,Object> map=null;
List<Map<String, Object>> listMap=new ArrayList<Map<String,Object>>(); 
for(int i=0;i<json.size();i++){
map = new HashMap<String,Object>();
     jsonOne = json.getJSONObject(i); 
     map.put("key", (String) jsonOne.get("Key"));
     map.put("value", (String) jsonOne.get("Value"));
     //只保留不为空的 键值对
     if( (String) jsonOne.get("Value")!=""&&!"".equals( (String) jsonOne.get("Value"))){
     listMap.add(map); 
     }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery .tmpl(), .template()学习资料小结
Jul 18 Javascript
禁用页面部分JavaScript方法的具体实现
Jul 31 Javascript
js中return false(阻止)的用法
Aug 14 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
Mar 04 Javascript
在easyUI开发中,出现jquery.easyui.min.js函数库问题的解决办法
Sep 11 Javascript
jQuery实用技巧必备(上)
Nov 02 Javascript
jQuery+css实现的切换图片功能代码
Jan 27 Javascript
Bootstrap中定制LESS-颜色及导航条(推荐)
Nov 21 Javascript
js时间控件只显示年月
Jan 08 Javascript
js中的面向对象入门
Mar 06 Javascript
vue2.0 根据状态值进行样式的改变展示方法
Mar 13 Javascript
React之PureComponent的使用作用
Jul 10 Javascript
vue实现循环滚动列表
Jun 30 #Javascript
js实现简单音乐播放器
Jun 30 #Javascript
angular中的post请求处理示例详解
Jun 30 #Javascript
vue开发简单上传图片功能
Jun 30 #Javascript
jquery实现上传图片功能
Jun 29 #jQuery
vue实现图片上传到后台
Jun 29 #Javascript
JS判断数组四种实现方法详解
Jun 29 #Javascript
You might like
深入理解PHP原理之Session Gc的一个小概率Notice
2011/04/12 PHP
那些年一起学习的PHP(二)
2012/03/21 PHP
Drupal读取Excel并导入数据库实例
2014/03/02 PHP
php使用GD创建保持宽高比缩略图的方法
2015/04/17 PHP
PHP中的表达式简述
2016/05/29 PHP
laravel在中间件内生成参数并且传递到控制器中的2种姿势
2019/10/15 PHP
让whoops帮我们告别ThinkPHP6的异常页面
2020/03/02 PHP
javascript Array数组对象的扩展函数代码
2010/05/22 Javascript
基于jquery实现图片广告轮换效果代码
2011/07/07 Javascript
使用jquery.qrcode.min.js实现中文转化二维码
2016/03/11 Javascript
AngularJS模板加载用法详解
2016/11/04 Javascript
简单谈谈关于Angular Cli打包的事
2017/09/05 Javascript
使用html+js+css 实现页面轮播图效果(实例讲解)
2017/09/21 Javascript
nest.js 使用express需要提供多个静态目录的操作方法
2019/10/24 Javascript
js页面加载后执行的几种方式小结
2020/01/30 Javascript
多页vue应用的单页面打包方法(内含打包模式的应用)
2020/06/11 Javascript
python采用django框架实现支付宝即时到帐接口
2016/05/17 Python
浅谈python中的__init__、__new__和__call__方法
2017/07/18 Python
Django查询数据库的性能优化示例代码
2017/09/24 Python
对python内置map和six.moves.map的区别详解
2018/12/19 Python
python爬虫之urllib,伪装,超时设置,异常处理的方法
2018/12/19 Python
Django中Middleware中的函数详解
2019/07/18 Python
Python求解正态分布置信区间教程
2019/11/20 Python
python删除指定列或多列单个或多个内容实例
2020/06/28 Python
基于tensorflow for循环 while循环案例
2020/06/30 Python
python通过函数名调用函数的几种场景
2020/09/23 Python
澳大利亚百货公司:David Jones
2018/02/08 全球购物
日常奢侈品,轻松购物:Verishop
2019/08/20 全球购物
绘儿乐产品官方在线商店:Crayola.com
2019/09/07 全球购物
Java程序员面试题
2013/07/15 面试题
计算机专业毕业生自荐信范文
2014/03/06 职场文书
教师师德承诺书
2014/03/26 职场文书
师德师风整改措施
2014/10/24 职场文书
创业计划书之蛋糕店
2019/08/29 职场文书
如何用PHP实现多线程编程
2021/05/26 PHP
使用Spring处理x-www-form-urlencoded方式
2021/11/02 Java/Android