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 相关文章推荐
JS完成代码前最好对其做5件事
Apr 07 Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
Jul 31 Javascript
javascript中基本类型和引用类型的区别分析
May 12 Javascript
javascript实现将文件保存到本地方法汇总
Jul 26 Javascript
如何在Linux上安装Node.js
Apr 01 Javascript
JQuery.validate在ie8下不支持的快速解决方法
May 18 Javascript
JavaScript制作颜色反转小游戏
Sep 25 Javascript
原生js实现轮播图
Feb 27 Javascript
JS字符串去除连续或全部重复字符的实例
Mar 08 Javascript
一个小时快速搭建微信小程序的方法步骤
Apr 15 Javascript
Vue实现点击当前元素以外的地方隐藏当前元素(实现思路)
Dec 04 Javascript
Antd的Table组件嵌套Table以及选择框联动操作
Oct 24 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获取POST数据的几种方法汇总
2015/03/03 PHP
PHP模拟asp中response类实现方法
2015/08/08 PHP
2007/12/23更新创意无限,简单实用(javascript log)
2007/12/24 Javascript
一个报数游戏js版(约瑟夫环问题)
2010/08/05 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
2013/04/18 Javascript
javascript中全局对象的isNaN()方法使用介绍
2013/12/19 Javascript
AngularJs中route的使用方法和配置
2016/02/04 Javascript
下雪了 javascript实现雪花飞舞
2020/08/02 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
对Js OOP编程 创建对象的一些全面理解
2016/07/26 Javascript
JS和canvas实现俄罗斯方块
2017/03/14 Javascript
nodejs获取微信小程序带参数二维码实现代码
2017/04/12 NodeJs
React Native 集成jpush-react-native的示例代码
2017/08/16 Javascript
Node.Js中实现端口重用原理详解
2018/05/03 Javascript
JavaScript捕捉事件和阻止冒泡事件实例分析
2018/08/03 Javascript
微信小程序自定义头部导航栏和导航栏背景图片 navigationStyle问题
2019/07/26 Javascript
基于Node的Axure文件在线预览的实现代码
2019/08/28 Javascript
JavaScript实现图片上传并预览并提交ajax
2019/09/30 Javascript
vue v-for直接循环数字实例
2019/11/07 Javascript
[34:08]2018DOTA2亚洲邀请赛3月29日 小组赛B组 VP VS EG
2018/03/30 DOTA
python实现备份目录的方法
2015/08/03 Python
详解C++编程中一元运算符的重载
2016/01/19 Python
使用Python和xlwt向Excel文件中写入中文的实例
2018/04/21 Python
python 采用paramiko 远程执行命令及报错解决
2019/10/21 Python
使用pyhon绘图比较两个手机屏幕大小(实例代码)
2020/01/03 Python
Python tkinter三种布局实例详解
2020/01/06 Python
Python处理PDF与CDF实例
2020/02/26 Python
日本高端护肤品牌:Tatcha
2016/08/29 全球购物
Sql面试题
2013/03/20 面试题
2014迎国庆标语大全
2014/09/19 职场文书
大学生暑期社会实践证明范本
2014/10/24 职场文书
诺贝尔奖获得者名言100句:句句启人心智,值永久收藏
2019/08/09 职场文书
redis哨兵常用命令和监控示例详解
2021/05/27 Redis
JS中如何优雅的使用async await详解
2021/10/05 Javascript
Python内置数据类型中的集合详解
2022/03/18 Python
室外天线与收音机天线杆接合方法
2022/04/05 无线电