jquery.serializejson.min.js的妙用
关于这个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的妙用的更多相关文章
- jquery.validate.min.js 用法方法示例
页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决
之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...
- 通过jquery.transit.min.js插件,实现图片的移动
首先给出插件:jquery.transit.min.js (function(t,e){if(typeof define==="function"&&define. ...
- Bootstrap导航点击菜单跳转与点击缩放菜单折叠按钮缓冲效果插件jquery.singlePageNav.min.js
引入步骤: <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></scrip ...
- JSON对象配合jquery.tmpl.min.js插件,手动攒出一个table
jquery.tmpl.min.js 首先下载这个插件 1.绑定json那头的键 //TemplateDDMX 这个是这段JS的ID,这个必须写!!!!!! //${}为json的键的值,必须要填写正 ...
- jquery.qrcode.min.js生成二维码 通过前端实现二维码生成
主体代码: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <tit ...
- Uncaught TypeError: Cannot read property 'call' of undefined jquery.validate.min.js:28
最近在做表单验证时,,自己写的addMethod 方法总是不起作用.折腾了将近一天. 报告的错误,如下面的 Uncaught TypeError: Cannot read property 'call ...
- web下c#用jquery.tmpl.min.js插件实现分页查询_yginuo
背景:webform或者mvc下实现插件快速分页 ps:我这里用的mvc开发的,数据库连接.用的ADO.NET实体数据模型 此案例下载地址(内含需要用到的一个插件与数据库):http://downlo ...
- 为网页生成二维码(jquery.qrcode.min.js)
做网站活动页面的时候,要为每个活动生成一个二维码,虽然简单,但还是习惯记录下来. jquery.qrcode.min.js是js的一个库,主流的浏览器都支持:IE6~10, Chrome, Firef ...
随机推荐
- Java同步数据结构之Map概述及ConcurrentSkipListMap原理
引言 前面介绍了CopyOnWriteArraySet,本来接着是打算介绍ConcurrentSkipListSet,无耐ConcurrentSkipListSet的内部实现其实是依赖一个Concur ...
- vsftp配置详解
vsftpd作为一个主打安全的FTP服务器,有很多的选项设置.下面介绍了vsftpd的配置文件列表,而所有的配置都是基于vsftpd.conf这个配置文件的.本文将提供完整的vsftpd.conf的中 ...
- Cobbler安装报错--dhcpd -t failed Exception occured: <class 'cobbler.cexceptions.CX'>
最近想玩一下自动化安装,就研究了一下cobbler,测试环境本来是想用CentOS6.X的,但是后来一想,还是想用CentOS7.X.然后就碰到坑了. 在同步cobbler配置的时候,发现了以下错误: ...
- lexicalized Parsing
$q$(S $\rightarrow$ NP VP) * $q$(NP $\rightarrow$ NNP) * $q$(VP $\rightarrow$ VB NP) * $q$(NP $\righ ...
- swift 第二课 基础知识-2
setter 和getter 的使用--> 适合计算使用 struct Point { var x = 0.0, y=0.0 } struct Size { var width = 0.0, h ...
- 微信小程序如何修改本地缓存key中的单个数据
假如用户注册后,获得用户手机号和userid,realName默认为0,然后进入B页面进行实名认证,认证成功后realName变为1,再更新缓存里的用户信息. A页面用户注册后,存储用户信息: var ...
- Telegram Groups vs Telegram Channels
Telegram Groups vs Telegram Channels By Iaroslav Kudritskiy Unlike other messaging apps, using Tele ...
- 【MOOC课程学习记录】程序设计与算法(一)C语言程序设计
课程结课了,把做的习题都记录一下,告诉自己多少学了点东西,也能给自己一点鼓励. ps:题目都在cxsjsxmooc.openjudge.cn上能看到,参考答案在差不多结课的时候也会在mooc上放出来. ...
- Reactor系列(三)创建Flux,Mono(续)
创建Mono 视频讲解:https://www.bilibili.com/video/av78944069/ FluxMonoTestCase.java package com.example.rea ...
- HDU6582 Path【优先队列优化最短路 + dinic最大流 == 最小割】
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6582 来源:2019 Multi-University Training Contest 1 题目大意 ...