记录jquery的ajax
1、直接干货
ajax很简单jquery有很好的支持,原生js就不写了。总的说常用的有3个方法
$.post
$.get
$.ajax
具体参数参考教程http://www.runoob.com/jquery/ajax-post.html
$.get\$.post主要4个参数url,params,callback,type用法在教程很详细我就不说了
主要说的有1点,get方法很方便,可以用,post方法尽量少用,在spring框架下接收参数不是很舒服,不能直接用对象接收参数。
在项目应用中常要这样接收参数
public String login(@RequestBody User user, HttpServletRequest request, HttpServletResponse response) throws UnsupportedEncodingException{
直接用$.post接收不到User对象,只能单个传参,很麻烦,所以这里推荐用$.ajax方法
2、
function submitForm(){
/*<![CDATA[*/
var url = /*[[@{/user/login}]]*/null;
if ([[${redirectURL}]] != null){
var redirectURL = "?redirectURL="+/*[[${redirectURL}]]*/;
url = url + redirectURL;
}
var params = $("#userForm").serializeJson();
if ($("#userMobile").val() == ""){
alert("手机号为空。");
$("#userMobile").focus();
return;
}
if ($("#userPassword").val() == ""){
alert("密码为空。");
$("#userPassword").focus();
return;
}
$.ajax({
type:"POST",
url:url,
dataType:"json",
contentType:"application/json;charset=utf-8",
data:params,
success:function(result){
if (result.redirectURL != undefined){
location.href = result.redirectURL;
}else{
if (result.status == "200"){
location.href = "http://localhost";
}else{
alert(result.message);
}
}
}
});
/*]]>*/
}
代码中标红的就是将form表单中的数据对象化,这样上面的服务器代码就可以直接用对象接收了,很方便。
给出js的serializeJson 代码如下:
// 把json字符串封装成json对象
(function($) {
$.fn.serializeJson = function() {
var serializeObj = {};
var array = this.serializeArray();
var str = this.serialize();
$(array).each(
function() {
if (serializeObj[this.name]) {
if ($.isArray(serializeObj[this.name])) {
serializeObj[this.name].push(this.value);
} else {
serializeObj[this.name] = [
serializeObj[this.name], this.value ];
}
} else {
serializeObj[this.name] = this.value;
}
});
return JSON.stringify(serializeObj);
};
})(jQuery);
记录jquery的ajax的更多相关文章
- 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...
- 为jQuery的$.ajax设置超时时间
jQuery的ajax模块封装了非常强大的功能,有时候我们在发送一个ajax请求的时候希望能有一个超时的时间,想让程序在一段时间请求不到数据时做出一些反馈.幸运的是jQuery为我们提供了这样的参数: ...
- jquery中ajax的简单使用
一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...
- JQuery发送ajax请求不能用数组作为参数
JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){ var select ...
- 源码来袭!!!基于jquery的ajax分页插件(demo+源码)
前几天打开自己的博客园主页,无意间发现自己的园龄竟然有4年之久了.可是看自己的博客列表却是空空如也,其实之前也有写过,但是一直没发布(然而好像并没有什么卵用).刚开始学习编程时就接触到博客园,且在博客 ...
- 转: 如何实现jQuery的Ajax文件上传
[PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是PHP,JSP,还是ASP处理上传的文件,其实都是WEB早已把文件上传到服务器了,我们只是运用上 ...
- Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇)
原文:Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇) 老话说的好:好记心不如烂笔头! 本着这原则,我把最近工作中遇到的jquery利用ajax调用web服务的 ...
- JQuery和Ajax在ASP.NET MVC中的基本应用
当我们在开发Web应用程序中使用JQuery和Ajax异步调用来实现很多功能时,不仅提高了程序的性能,而且给用户一个更好的交互式界面操作体验.接下来我们依旧用简单的实例来学习下它们的应用. 创建一个A ...
- 记一次艰难的jquery easy-ui ajax post 体验
分享的经验和教训是: 1.jquery easy-ui ajax post 复杂的Json给后端解析,后端如果接收和解析 2.asp.net webform jquery easy-ui datagr ...
随机推荐
- kbmmw 的远程桌面功能2-android手机端
前面讲了PC 端的远程操作,今天讲一下如何用手机控制远程桌面(真的能操作的很爽吗?), 要使手机可以远程控制,首先在在kbmmwconfig.inc 文件里面加入FMX 支持 {$DEFINE KBM ...
- CodeCraft-19 and Codeforces Round #537 (Div. 2) D 多重排列 + 反向01背包 + 离线处理
https://codeforces.com/contest/1111/problem/D 多重排列 + 反向01背包 题意: 给你一个字符串(n<=1e5,n为偶数),有q个询问,每次询问两个 ...
- Ubuntu 16.04 安装 postgresql 9.3
1.Ctrl+Alt+t 打开终端 2.输入:wget --quiet -O - https://www.postgresql.org/media/keys/ACCC4CF8.asc | sudo a ...
- C++STL deque
deque双端数组 deque<int> dq; deque<int>::iterator it; dq.push_back();//尾部插入元素 dq.push_front( ...
- mfc标题栏 菜单 退出 关机 重启
隐藏标题栏 int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct) { if (CFrameWnd::OnCreate(lpCreateStru ...
- POJ 3110 Jenny's First Exam (贪心)
题意:告诉你n 个科目的考试日期,在考试当天不能复习,每一个科目的最早复习时间不能早于考试时间的t天,每一天你可以复习完一科,也只能复习一科,求最晚的复习时间!. 析:由于题目给定的时间都在1900 ...
- 一个简单的MySQL多实例环境搭建
安装mysql 初始化两个数据库目录 mysql_install_db --datadir=/usr/local/var/mysql1 --user=mysql mysql_install_db -- ...
- Mac-控制台更新svn版本
brew install subversion 直接安装svbversion至最新版本
- CentOS 6.0 安装配置rails 2.3.11 + redmine 1.2.1 笔记
没想到安装过程这么曲折,gem安装时下载经常是不成功的,无耐只好把.gem文件下载回来再本地安装,加上radmine 1.2.1对各组件的版本了也比较挑剔,中间走了不少弯路,折腾了二天时间,终于摸清路 ...
- VS IDE 中Visual C++ 中的项目属性配置
VS IDE 中Visual C++ 中的项目属性配置 一. Visual C++ 项目系统基于 MSBuild. 虽然可以直接在命令行上编辑 XML 项目文件和属性表,我们仍建议你使用 VS IDE ...