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 ...
随机推荐
- Q114第一颗二叉查找树(链式)
输入n,然后n个树,建立二叉查找树.从小到大输出每个节点的左右子树,空输出# #include<cstdio> #include<iostream> using namespa ...
- 个性二维码开源专题<液化/圆角/效果>
基础方法: ChangeFillShape //修改填充形状 ChangeFillShape(...) // 摘要: // 修改填充形状 // // 参数: // g: // 图形画板 // // F ...
- Chrome RenderText分析(2)
接Chrome RenderText分析(1) 继续分析以下步骤 一.TextRun结构 struct TextRun { TextRun(); ~TextRun(); ui::Range r ...
- [安卓] 5、SeekBar拖动条
越来越发现这些控件用法大同小异了,这里注意几个函数:seekBar.setSecondaryProgress(0);设置初始进度为0,总共为0~99,对其监听用setOnSeekBarChangeLi ...
- C#课外实践——校园二手平台(心得篇)
先声明一下,现在回头看一下自己做的小程序,感觉很不怎么地.但是通过这次的实践明白了很多的东西.至于程序实现的什么给你,通过名字就可以猜出来.不过,是客户端的.我想,这应该是我见过的第一个以客户端为模式 ...
- paip.多维理念 输入法的外码输入理论跟文字输出类型精髓
paip.多维理念 输入法的外码输入理论跟文字输出类型精髓 通常,我们的输入法使用的外码是拼音,但是,这个的用户体验很差.. 应该使用多个外码类型... ##按照词汇来源,有如下几个 固有词ati 来 ...
- paip.函数式编程方法概述以及总结
paip.函数式编程方法概述以及总结 1 函数式编程:函数式风格..很多命令式语言里支持函数式编程风格 1.1 起源 (图灵机,Lisp机器, 神经网络计算机) 1.2 函 ...
- 从题目中学习java语法
一.输入输出 1.输入圆的半径,计算并输出圆的周长和面积: import java.util.Scanner; public class zuoye01_circle { public static ...
- web前端基础——jQuery编程基础
1 jQuery简介 jQuery是一个兼容多浏览器的JavaScript库,核心理念是write less,do more(写得更少,做得更多).它对JavaScript进行了封装,使开发更便捷,并 ...
- python函数的参数
代码: # coding=utf8 # 可以传入任何个参数 def calc(*numbers): sum = 0 for n in numbers: sum = sum + n * n return ...