jQuery ajax()使用serialize()序列化表单方法

 jQuery/js   高蒙   阅读(3495)   评论(0)   2015-12-15 20:53:59    serialize()序列化表单方法 jQuery  ajax() 


最近在做destoon二次开发的时候,学到了新的知识,ajax提交表单的新方法。

jQuery serialize()的方法,它是序列化表单值,一次性的获得所有的form表单的所有值。
为什么我会用到这个呢,在写留言部分的时候,要提交很多的数据,由于是要用ajax提交。
所以要获取到所有的表单的value值,一个表单有几个字段还可以手动的获取,如果是几十个字段呢?那不是很费时间,费力气的获取value值,而且还写了一大串的代码,我看着头疼。于是,我就去找代码,看看他是怎么获取的,于是就找到了ajax处理的文件。发现了其中它是用serialize()的方法,获取的所有的表单值。开始很疑惑,这个该怎么用,于是就自己去实践了。用过之后,我才发现,这个真的很好用。
 
下面介绍我们jQuery serialize()的方法怎么使用,如何去获取表单的所有的值和用ajax提交数据。
 

第一步:我们的form表单代码。

<form id="form1">
<input name="title" type="text" value="">
<input name="username" type="text" value="">
</form>

第二步:我们怎么使用serialize()的方法,获取到所有的表单值。

    $.ajax({
                cache: true,
                type: "POST",
                url:'你的请求网址',
                data:$("#form1").serialize(),// form1 就是你的表单的id
                async: false,
                dataType:'json',
                success: function(data) {
                    if(data == 1){
                        alert('发布成功');
                    }else{
                         alert('发布失败');
                    }
                }
            });
 
是不是发现使用serialize()获取表单的值很简单,好方法赶紧的试试吧。
 
补充:$.get()、$.post()和$.getJSON()同样可以使用,这三种ajax提交方式,使用serialize()方法是一致的。
代码如下:

$.post('你的请求网址', $("form1").serialize(), function(data) {
        //代码。。。
    }

});


$.get('你的请求网址', $("form1").serialize(), function(data) {
       // 代码。。。
    }

});


$.getJSON('你的请求网址', $("form1").serialize(), function(data) {
        // 代码。。。
    }
});
 
备注:千万不要忘记引入你的jQuery.js文件。

 




相关文章



我要评论


站长昵称:(*)

输入内容:


评论列表


高蒙

男,程序猿一枚

 

人生要是没有理想, 那跟一条咸鱼有什么分别。


关于我

  http://www.shuchengxian.com

高蒙个人博客是以PHP技术为主的程序员个人博客。博客主要发布php开发中遇到的问题以及解决办法,同时个人博客也分享网站模板素材,jquery插件等方面素材。


站点声明:相关侵权、举报、投诉及建议等,请发E-mail:936594075#qq.com(#替换成@)。

Copyright © 2018, www.shuchengxian.com, All rights reserved. 个人博客皖公网安备 34152302000022号 皖ICP备15015490号

关键词:个人博客,PHP博客,PHP博客程序,高蒙博客,高蒙个人博客,php程序员博客,程序员个人博客