文章目录

  • 前言
  • 一、定义和用法
  • 二、使用
  • 三、注意事项

前言

我们在表单ajax请求中,往往会传递一些参数,要是一个个获取感觉很麻烦,于是jQuery提供serialize()方法,让我们可以方便快捷的获取到表单中想要的值。

一、定义和用法

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

您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身。

序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

$("form").serialize()

二、使用

.serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。

    <form action=""><p>用户名:<input type="text" name="mames"></p><p>密码:<input type="text" name="pass"></p><p>性别: <select name="sex" id=""><option>男</option><option>女</option></select></p><p>描述:<textarea id="" cols="30" rows="10" name="ms"></textarea></p><p><input type="button" value="提交" id="btn"></p></form>

serialize() 方法可以操作已选取个别表单元素的 jQuery 对象,比如 input,textarea 以及 select。不过,选择 form 标签本身进行序列化一般更容易些:

 <script src="./jquery-1.12.4.js"></script>$("#btn").click(function() {var pa = $("form").serialize()console.log(pa);})


通过上图可以看到输入中文乱码了,这是因为.serialize()自动调用了encodeURIComponent方法将数据编码了,解决办法就是调用decodeURIComponent(XXX,true);将数据解码。

pa = decodeURIComponent(pa, true);

三、注意事项

  • 如果表单元素没有name属性 就获取不到(必须要有name属性)
<p>用户名:<input type="text" name="mames"></p>
<p>密码:<input type="text"></p>

  • 必须要写在表单里面,即使有name也获取不到
 <form action=""><p>用户名:<input type="text" name="mames"></p><p><input type="button" value="提交" id="btn"></p></form><p>密码:<input type="text"></p>

  • 获取不到上传的文件,如果想要获取,需要使用FormDate对象。

jquery中serialize()相关推荐

  1. jquery中serialize()序列化函数

    全栈工程师开发手册 (作者:栾鹏) jquery系列教程6-AJAX全解 jquery中serialize()序列化函数 serialize()序列化,将元素转化为xx=xx&xx=xx&am ...

  2. jQuery 中 serialize() 、 serializeArray()和 $.param 的用法

    示例: <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8& ...

  3. JQuery中serialize()、serializeArray()和param()方法

    2019独角兽企业重金招聘Python工程师标准>>> 与JQuery中其他方法一样,serialize()方法也是作用于一个JQuery对象,它能够将DOM元素内容序列化为字符串, ...

  4. JQuery中serialize()、serializeArray()和param()方法示例介绍

    在项目中做form表单提交的时候,如果参数比较少,可以通过jquery一个个取得,但是当 form表参数很多的情况下,还是一一取得的话无疑是加大了工作量,那我们需要咱们获取到表单的所有参数呢,幸好,j ...

  5. JQuery中serialize()、serializeArray()和param()的使用方法

    1. serialize()方法 语法:$(selector).serialize() 输出序列化表单的字符串,文件上传控件(例如:<input type="file" na ...

  6. jQuery中常用的函数方法总结

    jQuery中为我们提供了很多有用的方法和属性,自己总结的一些常用的函数,方法.个人认为在www.21kaiyun.com的紫微斗数星座在线排盘开发中会比较常用的,仅供大家学习和参考. 事件处理 re ...

  7. jQuery中的常用内容总结(一)

    jQuery中的常用内容总结(一)   前言 不好意思(✿◠‿◠),由于回家看病以及处理一些其它事情耽搁了,不然这篇博客本该上上周或者上周写的:同时闲谈几句:在这里建议各位开发的童鞋,如果有疾病尽快治 ...

  8. jQuery 之 serialize() serializeArray()

    jQeury提供了2个帮助获取表单元素数据的方法.分别是serialize()  和 serializeArray().两者作用完全相同,只不过是返回值不同,前者是返回一个字符串,后者返回一个Json ...

  9. jQuery中FormData的使用

    web中数据提交事件是常常发生的,但是大多数情况下我们不希望使用html中的form表单提交,因为form表单提交会中断当前浏览器的操作并且会调到另一个地址(即使这个地址是当前页面),并且会重复加载一 ...

最新文章

  1. StringUtils之equals
  2. r语言 面板数据回归_R语言——伍德里奇计量经济导论案例实践 第十三章 横截面与面板数据(一)...
  3. Android知识点剖析系列:深入了解layout_weight属性
  4. 每日小记2017.2.20
  5. windows下php命令行模式错误信息
  6. 提升开发效率之命名规范
  7. jfinal使用配置文件注意事情
  8. 开启windows远程共享
  9. 关于xp英文版安装多国语言包的问题
  10. 监控服务器的日志文件,服务器上监控日志文件
  11. android手机如何设置提高网速,安卓手机设置网络速度的详细操作步骤
  12. Windows如何ping端口
  13. PCA降维算法的原理及应用
  14. 网络地址与直接广播地址有关计算
  15. 小米qq音乐|小米音乐qq版
  16. android FD泄露问题记录
  17. 阿里云企业邮箱域名注册流程
  18. Elasticsearch根据日期(年-月-日 时:分:秒)进行range(时间范围筛选)
  19. JS Uncaught TypeError: Cannot read property ‘indexOf‘ of null问题解决
  20. 上市公司注册城市、上市日期、成立日期以及行业和注册资本信息

热门文章

  1. 小白读odoo参考手册--字段
  2. Unity 生成全景图
  3. 计算机毕业设计(附源码)python信用卡逾期数据处理分析系统
  4. 调用pyspark.ml库对信用卡逾期进行预测
  5. 企业微信 jssdk调用 扫一扫 安卓不行 ios又可以
  6. 第九章 我国农村个体工商业
  7. 如何在百度通过关键词搜索自己的网站
  8. vue中用Element实现类手机端图库效果
  9. 2021-2022学年广州市海珠区九年级第一学期期中统考英语试题
  10. Fabric-samples开发模式下chaincode操作流程及错误锦集