jQuery ajax()使用serialize()提交form数据

xiaoqihv8个月前 (04-08)前端设计43

这几天一直在适配用户中心插件,基本的功能也差不多了,时间不长就会上线用户中心,当然适配的过程中也遇到不少的问题,今天记录一下。

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

jQuery的serialize(),$.post()、$.get()和$.getJSON(

我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化

如:

<form action="">First name: <input type="text" name="FirstName" value="Bill" /><br />Last name: <input type="text" name="LastName" value="Gates" /><br /></form>
$(document).ready(function(){    console.log($("form").serialize()); // FirstName=Bill&LastName=Gates});

这样,我们就可以把序列化的值传给ajax()作为url的参数,轻松使用ajax()提交form表单了,而不需要一个一个获取表单中的值然后传给ajax(),举例如下:

$.ajax({    type: 'post',    url: 'your url',    data: $("form").serialize(),    success: function(data) {        // your code    }});

使用$.post()、$.get()和$.getJSON()也是一样的:

$.post('your url', $("form").serialize(), function(data) {        // your code    }});$.get('your url', $("form").serialize(), function(data) {        // your code    }});$.getJSON('your url', $("form").serialize(), function(data) {        // your code    }});

相关文章

javascript中的addEventListener()方法

javascript中的addEventListener()方法

我们操作HTML DOM对象的时候,可以利addEventListener()方法为某个被选中的DOM对象添加一个事件,用来操作这个被选中的对象。下面就记录一下,如果利javascript的addEv...

javascript中的addLoadEvent函数解析

javascript中的addLoadEvent函数解析

onload事件是HTML DOM Event 对象的一个属性,又叫事件句柄(Event Handlers),它会在页面或图像加载完成后(注意是加载完成后)立即发生。window.onload = f...

jQuery获取当前页面的URL信息

在网站时不少客户要求导航条具有高亮功能,如果换到以前肯定是一个页面一个页面的去写代码,那样的话太麻烦,而且还不利于后期的维护和修改。不过现在有了jQuery了可以省去好多的事,再麻烦的事不就是一行JQ...

JQ获取某个元素下的所有图片并改变其属性

利用JQ获取某个元素下的所有图片并改变其属性...

JS实现上传头像并实时预览

JS实现上传头像并实时预览

说起各大网站的用户中心功能,其中就少不了用户头像上传这个小小的功能,如果我们依托框架来编写的的话,相信非常的容易,但如果我们自己来单纯的使用JS来实现头像上传,并在选择本地头像的时候,实现预览我想也是...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。