js实现表单序列化的两种方法。
function serialize(form) {
var parts = [],
elems = form.elements,
i = ,
len = elems.length,
filed = null;
for (; i < len; i++) {
filed = elems[i];
switch (filed.type) {
case "select-one":
case "select-multiple":
if (filed.name.length) {
var j = ,
opt,
optLen = filed.options.length;
for (; j < optLen; j++) {
opt = filed.options[j];
if (opt.selected) {
parts.push(encodeURIComponent(filed.name) + "=" + encodeURIComponent(opt.value));
}
}
}
break;
case undefined:
case "submit":
case "reset":
case "file":
case "button":
break;
case "radio":
case "checkbox":
if (!filed.checked) {
break;
}
default:
if (filed.name.length && filed.value) {
parts.push(encodeURIComponent(filed.name) + "=" + encodeURIComponent(filed.value));
}
}
}
return parts.join("&");
}
这个方法重点用了HTML5中的FormData ,还有es6中for of循环。
function serialize(form) {
var formData = new FormData(form),
getValue = formData.entries(),
parts = [];
for (var pair of getValue) {
parts.push(pair[] + "=" + pair[]);
}
return parts.join("&");
}
js实现表单序列化的两种方法。的更多相关文章
- js阻止表单提交的两种方法
下面直接看代码. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 使用JS和JQuery 阻止表单提交的两种方法
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- ace+validate表单验证(两种方法)
//修改密码(直接在validate中验证提交) $("#changePassword").on(ace.click_event, function() { var html = ...
- form表单提交的几种方法
form表单提交的几种方法 <form id="myform" name="myform" method="post" onsubmi ...
- js如何动态创建表格(两种方法)
js如何动态创建表格(两种方法) 一.总结 一句话总结: 1.方法一:写好创建表格的html代码,将之赋值给div的innerHTML. 2.方法二.直接用创建好的table元素的方法insertRo ...
- oracle多表关联删除的两种方法
oracle多表关联删除的两种方法 第一种使用exists方法 delete from tableA where exits ( select 1 from tableB Where tableA.i ...
- 原生JS实现表单序列化serialize()
有一个form表单,要用AJAX后台提交,原来想拼接json,但是数据多了麻烦,不灵活. 用HTML5的FormData来初始化表单 var formdata=new FormData(documen ...
- 原生JS—实现图片循环切换的两种方法
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...
- jsp——js事件修改属性样式的两种方法(直接赋值、修改属性)、验证表单符合某要求、阻止表单提交、告诉浏览器不要缓存
代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncodi ...
随机推荐
- Magicodes.WeiChat——后台JS框架封装
Magicodes.WeiChat同时也致力于提高后台开发效率,因此对在后台前端这块也做了一定的封装.我们先来说说主要的框架JS——mwc.js和mwc_elements.js.这两个JS文件位于Sc ...
- C#函数式编程之缓存技术
缓存技术 该节我们将分成两部分来讲解,第一部分为预计算,第二部分则为缓存.缓存这个技术对应从事开发的人员来说是非常熟悉的,从页面缓存到数据库缓存无处不在,而其最重要的特点就是在第一次查询后将数据缓存, ...
- Asp.Net Web API 2第十六课——Parameter Binding in ASP.NET Web API(参数绑定)
导航 阅读本文之前,您也可以到Asp.Net Web API 2 系列导航进行查看 http://www.cnblogs.com/aehyok/p/3446289.html. 本文主要来讲解以下内容: ...
- Asp.Net Web API 2第七课——Web API异常处理
前言 阅读本文之前,您也可以到Asp.Net Web API 2 系列导航进行查看 http://www.cnblogs.com/aehyok/p/3446289.html 本文主要来讲解Asp.Ne ...
- 《The Book of CSS3》学习笔记
一.浏览器前缀 E{ -moz-name : value; /* Firefox */ -ms-name : value; /* IE */ -o-name : value; /* Opera */ ...
- VS2012 生成事件
在一个解决方案中有多个项目的时候,我们常需要拷贝一些文件,dll到指定的目录下,或者遇到com组件还需要提前注册dll,这个就需要用到VS的生成事件. 一.位置: 项目-->右键-->属性 ...
- Git常用操作命令与图解
Git 是一个很强大的分布式版本控制系统.它不但适用于管理大型开源软件的源代码,管理私人的文档和源代码也有很多优势. Git常用操作命令: 1) 远程仓库相关命令 检出仓库:$ git clone g ...
- webView文本长按显示英文
webView文本长按显示英文时,在info.plist文件中添加如下内容: <key>CFBundleLocalizations</key> <array> &l ...
- paip. java的 函数式编程 大法
paip. java的 函数式编程 大法 Java 语言中常被忽视的一个方面是它被归类为一种命令式(imperative)编程语言.命令式编程虽然由于与 Java 语言的关联而相当普及,但是并不是惟一 ...
- static/final