// 表单序列化,IE9+
HTMLFormElement.prototype.serialize = function() {
var form = this;
// 表单数据
var arrFormData = [], objFormData = {}; [].slice.call(form.elements).forEach(function(ele) {
// 元素类型和状态
var type = ele.type, disabled = ele.disabled; // 元素的键值
var name = ele.name, value = encodeURIComponent(ele.value || 'on'); // name参数必须,元素非disabled态,一些类型忽略
if (!name || disabled || !type || (/^reset|submit|image$/i.test(type)) || (/^checkbox|radio$/i.test(type) && !ele.checked)) {
return;
} type = type.toLowerCase(); if (type !== 'select-multiple') {
if (objFormData[name]) {
objFormData[name].push(value);
} else {
objFormData[name] = [value];
}
} else {
[].slice.call(ele.querySelectorAll('option')).forEach(function(option) {
var optionValue = encodeURIComponent(option.value || 'on');
if (option.selected) {
if (objFormData[name]) {
objFormData[name].push(optionValue);
} else {
objFormData[name] = [optionValue];
}
}
});
}
}); for (var key in objFormData) {
arrFormData.push(key + '=' + objFormData[key].join());
} return arrFormData.join('&');
};

原生JS表单序列化的更多相关文章

  1. 原生js表单序列化----- FormData

    <style type="text/css"> .progress{ height: 10px; width: 600px; border: 1px solid red ...

  2. js表单序列化时,非空判断

    在项目中,对于数据的传输一般需要非空的判断,而数据字段较多时一般直接将表单序列化,此时如何判断非空,如下 因为将表单序列化时,数据格式为 trainKind=1&trainKindCode=1 ...

  3. 原生JS 表单提交验证器

    转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言 最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定 不用外部 ...

  4. Js 表单序列化

    http://www.w3cmm.com/javascript/serialize-form.html

  5. [备忘]js表单序列化代码

    function serialize(form) { var parts = [], elems = form.elements, i = 0, len = elems.length, filed = ...

  6. 原生JS实现表单序列化serialize()

    有一个form表单,要用AJAX后台提交,原来想拼接json,但是数据多了麻烦,不灵活. 用HTML5的FormData来初始化表单 var formdata=new FormData(documen ...

  7. 原生js实现form表单序列化

    当我们有form表单而且里面的表单元素较多时,咱们总不能一个个去获取表单元素内的值来进行拼接吧!这样会很让人蛋疼!为了方便与后台交互并且提高自己的开发效率,并且不让你蛋疼:我们一起用原生来写一个表单序 ...

  8. js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么

    js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么 一.总结 一句话总结:两者都是对表单进行序列化,serializeArray()返回的是json ...

  9. 表单序列化json字符串和js时间格式化

    js时间格式化 new Date().format("时间格式") Date.prototype.format = function(fmt) { var o = {        ...

随机推荐

  1. BZOJ1012_Maxnumber_KEY

    题目传送门 这是一道单调栈的问题,单调栈维护所有数的最大值. 查询操作时只需要二分找答案即可,枚举栈内的数应该也不会超时. code: /******************************* ...

  2. 北京Uber优步司机奖励政策(3月19日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  3. Java:当前线程运行完毕,再运行后续逻辑

    一.问题描述 在程序设计中,可能存在这样的情景:主线程中存在一个子线程,子线程需要在执行完毕后为后续代码逻辑提供参数.但在代码执行时,子进程还没执行完毕,后续的代码已经开始执行了,这时候就会出现参数为 ...

  4. Qt 解析EXcel文件

    写代码需要将excel中的文件导入到数据库中 网上找到以为大神写的,但是当初没有保存,也没有找到 我几乎是原分不动拔下来的,希望大神莫怪 void AddDialog::readExcel(QStri ...

  5. Java 递归 反射 正则表达式

    一 递归 1. 就是函数自身调用自身 (就是在栈内存中不断的加载同一个函数) 2. 什么时候用递归呢? 当一个功能被重复使用 而每一次使用该功能时的参数不确定 都由上次的功能元素结果来确定 简单说: ...

  6. 在deepin系统中制作桌面快捷方式

    在使用deepin-wine 安装一些软件的时候,每次启动都需要到.deepinwine目录下运行deepin-wine xx.exe.笔者在安装过HeidiSql之后,一直苦于这种情况.比较好的解决 ...

  7. python爬虫基础之一(爬淘宝)

    没想到python如此强大, 今天看一会视频学会了一段python爬虫 这就是我今天学到的内容爬去淘宝网关于书包的一些信息,包括价格, #coding=utf-8 import requests#导入 ...

  8. 【rich-text】 富文本组件说明

    [rich-text] 富文本组件可以显示HTML代码样式. 1)支持事件:tap.touchstart.touchmove.touchcancel.touchend和longtap 2)信任的HTM ...

  9. 【jmeter进阶之逻辑控制器】

    jmeter进阶之逻辑控制器  转载   https://www.cnblogs.com/malinalian/p/10491946.html   常用的逻辑控制器 1,循环控制器:可以设置该控制器内 ...

  10. 论文笔记:Deep Attentive Tracking via Reciprocative Learning

    Deep Attentive Tracking via Reciprocative Learning NIPS18_tracking Type:Tracking-By-Detection 本篇论文地主 ...