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的更多相关文章

  1. 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache

    虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...

  2. 为jQuery的$.ajax设置超时时间

    jQuery的ajax模块封装了非常强大的功能,有时候我们在发送一个ajax请求的时候希望能有一个超时的时间,想让程序在一段时间请求不到数据时做出一些反馈.幸运的是jQuery为我们提供了这样的参数: ...

  3. jquery中ajax的简单使用

    一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...

  4. JQuery发送ajax请求不能用数组作为参数

    JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){        var select ...

  5. 源码来袭!!!基于jquery的ajax分页插件(demo+源码)

    前几天打开自己的博客园主页,无意间发现自己的园龄竟然有4年之久了.可是看自己的博客列表却是空空如也,其实之前也有写过,但是一直没发布(然而好像并没有什么卵用).刚开始学习编程时就接触到博客园,且在博客 ...

  6. 转: 如何实现jQuery的Ajax文件上传

    [PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是PHP,JSP,还是ASP处理上传的文件,其实都是WEB早已把文件上传到服务器了,我们只是运用上 ...

  7. Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇)

    原文:Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇) 老话说的好:好记心不如烂笔头! 本着这原则,我把最近工作中遇到的jquery利用ajax调用web服务的 ...

  8. JQuery和Ajax在ASP.NET MVC中的基本应用

    当我们在开发Web应用程序中使用JQuery和Ajax异步调用来实现很多功能时,不仅提高了程序的性能,而且给用户一个更好的交互式界面操作体验.接下来我们依旧用简单的实例来学习下它们的应用. 创建一个A ...

  9. 记一次艰难的jquery easy-ui ajax post 体验

    分享的经验和教训是: 1.jquery easy-ui ajax post 复杂的Json给后端解析,后端如果接收和解析 2.asp.net webform jquery easy-ui datagr ...

随机推荐

  1. 2019.02.09 bzoj2560: 串珠子(状压dp+简单容斥)

    传送门 题意简述:nnn个点的带边权无向图,定义一个图的权值是所有边的积,问所有nnn个点都连通的子图的权值之和. 思路: fif_ifi​表示保证集合iii中所有点都连通其余点随意的方案数. gig ...

  2. 2019.01.21 bzoj2989: 数列(二进制分组+主席树)

    传送门 二进制分组入门题. 主席树写错调题2h+2h+2h+体验极差. 题意简述:给一堆点,支持加入一个点,询问有多少个点跟(x,y)(x,y)(x,y)曼哈顿距离不超过kkk. 思路:题目要求的是对 ...

  3. 2018.11.09 bzoj2165: 大楼(倍增+floyd)

    传送门 先倍增出iii使得2i2^i2i时间时刚好有每个点能够到mmm层及以上. 然后就可以用floyd+floyd+floyd+倍增求出刚好不超过mmm层的时间,最后再补一层就行了. 代码: #pr ...

  4. mysql 外键理解

    假定一个班级的学生个人信息表: 什么是外键 在设计的时候,就给表1加入一个外键,这个外键就是表2中的学号字段,那么这样表1就是主表,表2就是子表.(注意: 外键不一定须要作为从表的主键.外键也不一定是 ...

  5. 牛客训练四:Applese 的回文串(思维)

    题目链接:传送门 思路:插入不同的字符与删除不同的字符相同,所以每次判断到不同位置时将这个字符删除然后判断是否为回文串即可, 如果一开始就是回文串,那么答案也是yes. #include<ios ...

  6. react父转子

    父组件使用子组件,子组件绑定父组件数据 ,子组件用props使用父组件数据 import React, { Component } from 'react'; import logo from './ ...

  7. 计算给定多项式在给定点X处的值

    //计算多项式求值 //计算多项式求值#include<iostream>#include<ctime>#include<cmath>using namespace ...

  8. 2.2.2synchronized同步代码块的使用

    当两个并发线程访问同一个对象object中的synchronized(this)同步代码块时,一段时间内只能有一个线程执行,另一个线程必须等待期执行完才能执行. package com.cky.bea ...

  9. classmethod,staticmethod

    '''1 绑定方法: 在类内部定义的函数,默认就是给对象来用,而且是绑定给对象用的,称为对象的绑定方法 绑定对象的方法特殊之处: 应该由对象来调用,对象来调用,会自动将对象当作第一个参数传入 绑定到类 ...

  10. python爬虫之一:requests库

    目录 安装requtests requests库的连接异常 HTTP协议 HTTP协议对资源的操作 requests库的7个主要方法 request方法 get方法 网络爬虫引发的问题 robots协 ...