jQuery Ajax使用实例


Posted in Javascript onApril 16, 2015

Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的差异了。

$.post、$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()
一、$.ajax的一般格式

$.ajax({
   type: 'POST',
   url: url ,
  data: data ,
  success: success ,
  dataType: dataType
});

二、$.ajax的参数描述

参数 描述
url     必需。规定把请求发送到哪个 URL。
data 可选。映射或字符串值。规定连同请求发送到服务器的数据。
success(data, textStatus, jqXHR) 可选。请求成功时执行的回调函数。
dataType 可选。规定预期的服务器响应的数据类型。
默认执行智能判断(xml、json、script 或 html)。
三、$.ajax需要注意的一些地方:

1.data主要方式有三种,html拼接的,json数组,form表单经serialize()序列化的;通过dataType指定,不指定智能判断。

2.$.ajax只提交form以文本方式,如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit

四、$.ajax我的实际应用例子

//1.$.ajax带json数据的异步请求 
var aj = $.ajax( {  
  url:'productManager_reverseUpdate',// 跳转到 action  
  data:{  
       selRollBack : selRollBack,  
       selOperatorsCode : selOperatorsCode,  
       PROVINCECODE : PROVINCECODE,  
       pass2 : pass2  
  },  
  type:'post',  
  cache:false,  
  dataType:'json',  
  success:function(data) {  
    if(data.msg =="true" ){  
      // view("修改成功!");  
      alert("修改成功!");  
      window.location.reload();  
    }else{  
      view(data.msg);  
    }  
   },  
   error : function() {  
     // view("异常!");  
     alert("异常!");  
   }  
}); 
 
 
//2.$.ajax序列化表格内容为字符串的异步请求 
function noTips(){  
  var formParam = $("#form1").serialize();//序列化表格内容为字符串  
  $.ajax({  
    type:'post',    
    url:'Notice_noTipsNotice',  
    data:formParam,  
    cache:false,  
    dataType:'json',  
    success:function(data){  
    }  
  });  
}  
 
 
//3.$.ajax拼接url的异步请求 
var yz=$.ajax({  
   type:'post',  
   url:'validatePwd2_checkPwd2?password2='+password2,  
   data:{},  
   cache:false,  
   dataType:'json',  
   success:function(data){  
     if( data.msg =="false" ) //服务器返回false,就将validatePassword2的值改为pwd2Error,这是异步,需要考虑返回时间  
     {  
        textPassword2.html("<font color='red'>业务密码不正确!</font>");  
        $("#validatePassword2").val("pwd2Error");  
        checkPassword2 = false;  
        return;  
      }  
   },  
   error:function(){}  
});  
 
 
//4.$.ajax拼接data的异步请求 
$.ajax({   
  url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',   
  type:'post',   
  data:'merName='+values,   
  async : false, //默认为true 异步   
  error:function(){   
    alert('error');   
  },   
  success:function(data){   
    $("#"+divs).html(data);   
  } 
});
Javascript 相关文章推荐
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 Javascript
JavaScript获取对象在页面中位置坐标的方法
Feb 03 Javascript
jquery-mobile表单的创建方法详解
Nov 23 Javascript
利用vue-router实现二级菜单内容转换
Nov 30 Javascript
基于JQuery实现的跑马灯效果(文字无缝向上翻动)
Dec 02 Javascript
JavaScript基础之AJAX简单的小demo
Jan 29 Javascript
基于JavaScript实现复选框的全选和取消全选
Feb 09 Javascript
jquery实现倒计时小应用
Sep 19 jQuery
vue 不使用select实现下拉框功能(推荐)
May 17 Javascript
vue柱状进度条图像的完美实现方案
Aug 26 Javascript
JQuery实现折叠式菜单的详细代码
Jun 03 jQuery
JavaScript实现网页tab栏效果制作
Nov 20 Javascript
javascript等号运算符使用详解
Apr 16 #Javascript
php常见的页面跳转方法汇总
Apr 15 #Javascript
jquery图片切换实例分析
Apr 15 #Javascript
JavaScript实现的encode64加密算法实例分析
Apr 15 #Javascript
JavaScript实现拖拽网页内元素的方法
Apr 15 #Javascript
jQuery+html5实现div弹出层并遮罩背景
Apr 15 #Javascript
jquery实现简单的无缝滚动
Apr 15 #Javascript
You might like
Apache+php+mysql在windows下的安装与配置图解(最新版)
2008/11/30 PHP
php错误日志简单配置方法
2016/07/11 PHP
JS是否可以跨文件同时控制多个iframe页面的应用技巧
2007/12/16 Javascript
JQuery与iframe交互实现代码
2009/12/24 Javascript
理解JavaScript中的对象 推荐
2011/01/09 Javascript
jquery 获取自定义属性(attr和prop)的实现代码
2012/06/27 Javascript
javascript垃圾收集机制与内存泄漏详细解析
2013/11/11 Javascript
关于JavaScript中name的意义冲突示例介绍
2014/05/29 Javascript
Javascript this 关键字 详解
2014/10/22 Javascript
JavaScript获取两个数组交集的方法
2015/06/09 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
SpringMVC返回json数据的三种方式
2015/12/10 Javascript
使用jQuery判断Div是否在可视区域的方法 判断div是否可见
2016/02/17 Javascript
AngularJS中$http服务常用的应用及参数
2016/08/22 Javascript
vue.js绑定class和style样式(6)
2016/12/09 Javascript
Javascript实现base64的加密解密方法示例
2017/06/27 Javascript
ES6学习笔记之map、set与数组、对象的对比
2018/03/01 Javascript
JS与jQuery判断文本框还剩多少字符可以输入的方法
2018/09/01 jQuery
node.js express框架简介与实现
2019/07/23 Javascript
jQuery-App输入框实现实时搜索
2020/11/19 jQuery
django 发送邮件和缓存的实现代码
2018/07/18 Python
Python中使用双下划线防止类属性被覆盖问题
2019/06/27 Python
django 信号调度机制详解
2019/07/19 Python
Python基于内置库pytesseract实现图片验证码识别功能
2020/02/24 Python
怎样实现H5+CSS3手指滑动切换图片的示例代码
2019/05/05 HTML / CSS
Shop Apotheke瑞士:您的健康与美容网上商店
2019/10/09 全球购物
Opodo意大利:欧洲市场上领先的在线旅行社
2019/10/24 全球购物
团员学习总结的自我评价范文
2013/10/14 职场文书
创意广告词
2014/03/17 职场文书
三好学生演讲稿范文
2014/04/26 职场文书
英语系毕业生求职信
2014/07/13 职场文书
委托书如何写
2014/08/30 职场文书
地理科学专业自荐信
2014/09/01 职场文书
机动车交通事故协议书
2015/01/29 职场文书
2015年幼儿园师德师风建设工作总结
2015/10/23 职场文书
Python机器学习之逻辑回归
2021/05/11 Python