1.把表单转换出json对象

 //把表单转换出json对象
$.fn.toJson = function () {
var self = this,
json = {},
push_counters = {},
patterns = {
"validate": /^[a-zA-Z][a-zA-Z0-9_]*(?:\[(?:\d*|[a-zA-Z0-9_]+)\])*$/,
"key": /[a-zA-Z0-9_]+|(?=\[\])/g,
"push": /^$/,
"fixed": /^\d+$/,
"named": /^[a-zA-Z0-9_]+$/
}; this.build = function (base, key, value) {
base[key] = value;
return base;
}; this.push_counter = function (key) {
if (push_counters[key] === undefined) {
push_counters[key] = 0;
}
return push_counters[key]++;
}; $.each($(this).serializeArray(), function () {
// skip invalid keys
if (!patterns.validate.test(this.name)) {
return;
} var k,
keys = this.name.match(patterns.key),
merge = this.value,
reverse_key = this.name; while ((k = keys.pop()) !== undefined) {
// adjust reverse_key
reverse_key = reverse_key.replace(new RegExp("\\[" + k + "\\]$"), ''); // push
if (k.match(patterns.push)) {
merge = self.build([], self.push_counter(reverse_key), merge);
} // fixed
else if (k.match(patterns.fixed)) {
merge = self.build([], k, merge);
} // named
else if (k.match(patterns.named)) {
merge = self.build({}, k, merge);
}
} json = $.extend(true, json, merge);
}); return json;
};

  

2.将josn对象赋值给form

//将josn对象赋值给form
$.fn.loadData = function (obj) {
var key, value, tagName, type, arr; this.reset(); for (var x in obj) {
if (obj.hasOwnProperty(x)) {
key = x;
value = obj[x]; this.find("[name='" + key + "'],[name='" + key + "[]']").each(function () {
tagName = $(this)[0].tagName.toUpperCase();
type = $(this).attr('type');
if (tagName == 'INPUT') {
if (type == 'radio') {
if ($(this).val() == value) {
$(this).attr('checked', true);
}
} else if (type == 'checkbox') {
arr = value.split(',');
for (var i = 0; i < arr.length; i++) {
if ($(this).val() == arr[i]) {
$(this).attr('checked', true);
break;
}
}
} else {
$(this).val(value);
}
} else if (tagName == 'SELECT' || tagName == 'TEXTAREA') {
$(this).val(value);
}
});
}
}
}

  

JQuery扩展方法实现Form表单与Json互相转换的更多相关文章

  1. (笔记)JQuery扩展方法实现Form表单与Json互相转换

    JQuery笔记 记两段代码,使用JQuery实现从表单获取json与后端交互,以及把后端返回的json映射到表单相应的字段上. 把表单转换出json对象 //把表单转换出json对象 $.fn.to ...

  2. form表单转化json对象

    利用 $.fn 可以让每一个jquery 对象都能直接使用这个方法. //form表单转化json对象$.fn.serializeObject = function () { var o = {}; ...

  3. jquery实现ajax提交form表单的方法总结

    本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一:  function AddHandlingFeeToRefund( ...

  4. 使用ajax方法实现form表单的提交(附源码)

    写在前面的话 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控制页面的跳转及数据传递,但是在某些时候不希望页面跳转,或者说 ...

  5. 使用ajax方法实现form表单的提交

    作者:13 GitHub:https://github.com/ZHENFENG13 版权声明:本文为原创文章,未经允许不得转载. 写在前面的话 在使用form表单的时候,一旦点击提交触发submit ...

  6. form表单转换为Json字符串数据

    https://github.com/marioizquierdo/jquery.serializeJSON 效果图 加载使用 <script type="text/javascrip ...

  7. jquery实现ajax提交form表单的方法总结(转)

    方法一: 复制代码 代码如下: function AddHandlingFeeToRefund() {            var AjaxURL= "../OrderManagement ...

  8. jquery的ajax提交form表单方式总结

    方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderServic ...

  9. 3..jquery的ajax获取form表单数据

    jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...

随机推荐

  1. [算法笔记-题解]问题 A: 例题4-1 一元二次方程求根

    问题 A: 例题4-1 一元二次方程求根 [命题人 : 外部导入] 时间限制 : 1.000 sec 内存限制 : 12 MB 题目描述 求一元二次方程ax2+bx+c=0的根,三个系数a, b, c ...

  2. <数据结构>XDOJ316.多点测试的写法

    问题与解答 问题描述 有一棵无限大的完全二叉树,该二叉树自上而下.自左而右从1开始编号.从某一个结点到根结点(编号是1的结点)都有一条唯一的路径,比如从5到根结点的路径是(5, 2, 1),从4到根结 ...

  3. MATLAB/SIMULINK生成代码错误之change the default character encoding setting

    SIMULINK点击生成C代码报错 错误提示: Error encountered while executing PostCodeGenCommand for model 'RTW_sc3': Cl ...

  4. 分享一款开源堡垒机-jumpserver

    本文主文章地址为:https://blog.csdn.net/KH_FC JumpServer是由FIT2CLOUD(飞致远)公司旗下一款开源的堡垒机,这款也是全球首款开源的堡垒机,使用 GNU GP ...

  5. python float运算时存在浮点误差,结果小数点带.00002及解决方法

    背景: 返回一个json字符串,result结果里面嵌套多个内容一样,只有具体数据不一样的列表[字典],现在需要从里面取指定的key值,来计算最后的总额. 原来使用的类型,float 通过取到json ...

  6. 初识python 之 爬虫:爬取中国天气网数据

    用到模块: 获取网页并解析:import requests,html5lib from bs4 import BeautifulSoup 使用pyecharts的Bar可视化工具"绘制图表& ...

  7. VM搭建Hadoop环境遇到的问题

    原文链接:https://www.toutiao.com/i6482644128860471822/ 一.Slave2中sshd服务一直处于启动失败状态 查看配置文件 c 发现配置文件末尾slave2 ...

  8. Struts-S2-045漏洞利用

    最近也是在看Struts2的漏洞,这里与大家共同探讨一下,本次我复现的是s2-045这个编号的漏洞 漏洞介绍 Apache Struts 2被曝存在远程命令执行漏洞,漏洞编号S2-045,CVE编号C ...

  9. Spring Boot Admin,贼好使!

    Spring Boot Admin(SBA)是一个开源的社区项目,用于管理和监控 Spring Boot 应用程序.应用程序可以通过 http 的方式,或 Spring Cloud 服务发现机制注册到 ...

  10. [CISCN2019 华东南赛区]Web11

    [CISCN2019 华东南赛区]Web11 写在前面 参考文章:Smarty SSTI 1.{php}{/php} Smarty已经废弃{php}标签,强烈建议不要使用.在Smarty 3.1,{p ...