关于这个jquery.serializejson.min.js插件来看,他是转json的一个非常简单好用的插件。

  前端在处理含有大量数据提交的表单时,除了使用Form直接提交刷新页面之外,经常碰到的需求是收集表单信息成数据对象,Ajax提交。

而在处理复杂的表单时,需要一个一个区手动判断处理字段值,显得非常麻烦。接下来介绍的插件将解决这个问题。

关于serializeJSON

  使用jquery.serializeJSON,可以在基于jQuery或者Zepto的页面中,调用 .serializeJSON() 方法来序列化form表单的数据成JS对象。

下载

下载该插件的地址是:http://www.bootcdn.cn/jquery.serializeJSON/

使用

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.serializejson.js"></script>

参考

可以参考博文:https://www.cnblogs.com/linzenews/p/7065050.html

事例

拿一个我自己的小例子,对于页面表单多,而且元素多,后台要求使用ajax传递数据时,我使用了该插件,连校验都顺畅了很多。

我这表格是自动添加的。这个时候每个元素的name名称是一样的,所以我需要让后台知道对应的是哪个元素的值,这个时候我想到了这个插件

使用

var serializeObj=$('#s-form-a').serializeJSON();
var serializeStr=JSON.stringify(serializeObj);
console.log(serializeStr);

结果是另我满意的。

校验该插件,我使用了jquery.validate.js. 针对name名称一致的,使用了

'assessVoList[][losshow]':{
required:true,
},
'assessVoList[][losshow]':{
required:“不能为空”,
},
最后达到了满意的效果。关于jquery.validate.js的了解,我的博客里也有相应的介绍和总结,欢迎坐沙发!
												

jquery.serializejson.min.js的妙用的更多相关文章

  1. jquery.validate.min.js 用法方法示例

    页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  2. ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决

    之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...

  3. 通过jquery.transit.min.js插件,实现图片的移动

    首先给出插件:jquery.transit.min.js (function(t,e){if(typeof define==="function"&&define. ...

  4. Bootstrap导航点击菜单跳转与点击缩放菜单折叠按钮缓冲效果插件jquery.singlePageNav.min.js

    引入步骤: <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></scrip ...

  5. JSON对象配合jquery.tmpl.min.js插件,手动攒出一个table

    jquery.tmpl.min.js 首先下载这个插件 1.绑定json那头的键 //TemplateDDMX 这个是这段JS的ID,这个必须写!!!!!! //${}为json的键的值,必须要填写正 ...

  6. jquery.qrcode.min.js生成二维码 通过前端实现二维码生成

    主体代码: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <tit ...

  7. Uncaught TypeError: Cannot read property &#39;call&#39; of undefined jquery.validate.min.js:28

    最近在做表单验证时,,自己写的addMethod 方法总是不起作用.折腾了将近一天. 报告的错误,如下面的 Uncaught TypeError: Cannot read property 'call ...

  8. web下c#用jquery.tmpl.min.js插件实现分页查询_yginuo

    背景:webform或者mvc下实现插件快速分页 ps:我这里用的mvc开发的,数据库连接.用的ADO.NET实体数据模型 此案例下载地址(内含需要用到的一个插件与数据库):http://downlo ...

  9. 为网页生成二维码(jquery.qrcode.min.js)

    做网站活动页面的时候,要为每个活动生成一个二维码,虽然简单,但还是习惯记录下来. jquery.qrcode.min.js是js的一个库,主流的浏览器都支持:IE6~10, Chrome, Firef ...

随机推荐

  1. 在HTML中直接使用onclick很不专业

    原因 1.onclick添加的事件处理函数是在全局环境下执行的,这污染了全局环境,很容易产生意料不到的后果: 2.给很多DOM元素添加onclick事件,可能会影响网页的性能,毕竟网页需要的事件处理函 ...

  2. js中的splice方法和slice方法简单总结

    slice:是截取用的 splice:是做删除 插入 替换用的 slice(start,end): 参数: start:开始位置的索引 end:结束位置的索引(但不包含该索引位置的元素) 例如: va ...

  3. Linux下nginx配置https协议访问

    一.配置nginx支持https协议访问,需要在编译安装nginx的时候添加相应的模块--with-http_ssl_module 查看nginx编译参数:/usr/local/nginx/sbin/ ...

  4. C++ fill fill_n generate generate_n

    #include <iostream>#include <algorithm>#include <vector>#include <list>#incl ...

  5. AutoHome项目的学习

    1.自定义UITabBar #import <UIKit/UIKit.h> @interface XHQTabBarViewController : UITabBarController ...

  6. js模块化编程之彻底弄懂CommonJS和AMD/CMD

    转自 http://www.cnblogs.com/chenguangliang/p/5856701.html

  7. Centos7 系统更改apache默认网站目录(解决You don't have permission to access / on this server问题)

    当我们在Centos7中配置好Apache时,发现apache默认解析目录是在 /var/www/html,也就是说当访问服务器 IP 或者本地 localhost 时, 默认定位到这个目录里的 in ...

  8. ECS适合你吗?

    实体组件系统处于预览状态.不建议用于生产. 目前有两个很好的理由使用它. 你想试验 这是令人兴奋的新技术,并且大规模性能提升的承诺正在引诱.试试看.给我们您的反馈.我们很乐意在论坛上与您交谈. 您正在 ...

  9. Ubuntu搭建Spring源码环境常见问题

    在一心想要学习Spring框架源码时,我们会遇到很多麻烦的问题.开始本文前,你只需要拥有一个装好IDEA的Ubuntu系统就可以愉快启程了.如果还没有IDEA,可以参考在Ubuntu上安装Intell ...

  10. 齐治堡垒机前台远程命令执行漏洞(CNVD-2019-20835)分析

    一.基本信息 漏洞公告:https://www.cnvd.org.cn/flaw/show/1632201 补丁信息:该漏洞的修复补丁已发布,如果客户尚未修复该补丁,可联系齐治科技的技术支持人员获得具 ...