当前位置:Gxlcms > JavaScript > jQuery表单序列化实例代码

jQuery表单序列化实例代码

时间:2021-07-01 10:21:17 帮助过:2人阅读

这篇文章主要介绍了jQuery 表单序列化实例代码,需要的朋友可以参考下

废话不多说了,直接给大家贴代码了,具体代码如下所述:


以上是一段常规的ajax请求代码,其中分别列举了data参数的两种传递格式。

为了简便ajax请求时的data参数获取,jquery定义了几个快速的方法。

1.serialize()

  用法:var data = $("form").serialize();

  返回值:将表单内容序列化成一个字符串。

  这样在ajax提交表单数据时,就不用一一列举出每一个参数。只需将data参数设置为 $("form").serialize() 即可。

其核心方法是$.param(),用来对一个数组或对象按照key/value进行序列化,

var obj = {first:"one",last:"two"};
var str = $.param(obj);
console.log(str); // first=one&last=two

  另外,使用serialize有个好处是自带中文编译处理。所以,推荐使用serialize。

2.serializeArray()

  用法:var jsonData = $("form").serializeArray();

  返回值:将页面表单序列化成一个JSON结构(键值对)的对象。

  比如,[{"name":"lihui", "age":"20"},{...}] 获取数据为 jsonData[index].name

综上:在使用ajax提交表单数据时,data参数设置为$(form).serialize()或$(form).serializeArray()都可以。另外有些细节建议参考w3c。

最后补充一个完整实例。

html:


JavaScript:


php 提醒:需要配置php环境并开启服务器


以上就是jQuery 表单序列化实例代码的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行