分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 网页技术

jquery form表单序列化

发布时间:2023-09-06 02:17责任编辑:白小东关键词:form表单

一、serialize()

作用

serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。

语法

$(selector).serialize();

比如

$("button").click(function(){ ?$("div").text($("form").serialize());});

二、注意点

不能序列化file文件类型的input,只适用于一些常用的类型例如text、checkbox、select、date等。

三、FormData 对象

FormData的封装方式,可以将form表单中的内容封装成formdata的数据格式 ,file文件类型的数据同样可以封装。

var formdata = new FormData($(‘#form‘)[0]);

需要注意的是FormData是JavaScript对象,而$是jQuery对象。所以需要进行转化。

jQuery对象转成DOM对象:

1、jQuery对象是一个数据对象,可以通过[index]方法获得相应的DOM对象。

var $form=$(‘#form‘); //得到jQuery对象

var form=$("form")[0]; //转换成DOM对象

2、jQuery也可以通过.get(index)方法得到相应的DOM对象

var $form=$(‘#form‘); //得到jQuery对象

var form=$form.get(0); //得到DOM对象

 DOM对象转成jQuery对象:

只需要用$()将DOM对象包装起来,就能获得jQuery对象了

var form=document.getElementById("form"); //得到DOM对象

var $v=$(form); //转成jQuery对象

四、参数

$.ajax的contentType默认数据格式是name=value,每组之间用 & 联接。

 processData是Boolean类型的参数,默认为true。和contentType配合使用。

但是form表单用FormData封装之后就不在是contentType的默认数据格式了,所以要设置参数contentType: flase, processData: false.

也有说以formdata的方式提交时需要添加async:  false, 同步,否则后台无法接收到前台传过来的file文件数据。不过我在实际项目中没有添加async:  false也完全正确,没有任何报错。

(over)

jquery form表单序列化

原文地址:https://www.cnblogs.com/note-book/p/9750254.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved