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 相关文章推荐
Jquery中获取iframe的代码
Jan 11 Javascript
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
Apr 16 Javascript
JQuery获取各种宽度、高度(format函数)实例
Mar 04 Javascript
Extjs实现进度条的两种便捷方式
Sep 26 Javascript
JQuery查找子元素find()和遍历集合each的方法总结
Mar 07 Javascript
Vue中之nextTick函数源码分析详解
Oct 17 Javascript
JS实现随机生成10个手机号的方法示例
Dec 07 Javascript
Angular6 用户自定义标签开发的实现方法
Jan 08 Javascript
详解在Node.js中发起HTTP请求的5种方法
Jan 10 Javascript
Vue中qs插件的使用详解
Feb 07 Javascript
js轮播图之旋转木马效果
Oct 13 Javascript
vue切换菜单取消未完成接口请求的案例
Nov 13 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
php中判断字符串是否全是中文或含有中文的实现代码
2011/09/16 PHP
php数组(array)输出的三种形式详解
2013/06/05 PHP
用PHP来计算某个目录大小的方法
2014/04/01 PHP
PHP实现PDO操作mysql存储过程示例
2019/02/13 PHP
PHP7使用ODBC连接SQL Server2008 R2数据库示例【基于thinkPHP5.1框架】
2019/05/06 PHP
深入理解Javascript闭包 新手版
2010/12/28 Javascript
分析Node.js connect ECONNREFUSED错误
2013/04/09 Javascript
点击A元素触发B元素的事件在IE8下会识别成A元素
2014/09/04 Javascript
javascript消除window.close()的提示窗口
2015/05/20 Javascript
图片旋转、鼠标滚轮缩放、镜像、切换图片js代码
2020/12/13 Javascript
基于Javascript实现返回顶部按钮
2016/02/29 Javascript
基于BootStrap Metronic开发框架经验小结【八】框架功能总体界面介绍
2016/05/12 Javascript
微信小程序 教程之wxapp视图容器 swiper
2016/10/19 Javascript
js仿京东轮播效果 选项卡套选项卡使用
2017/01/12 Javascript
微信小程序page的生命周期和音频播放及监听实例详解
2017/04/07 Javascript
9种使用Chrome Firefox 自带调试工具调试javascript技巧
2017/12/22 Javascript
vue.js前后端数据交互之提交数据操作详解
2018/04/24 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
2018/06/24 Javascript
js实现简单选项卡功能
2020/03/23 Javascript
可能被忽略的一些JavaScript数组方法细节
2019/02/28 Javascript
JS中比较两个Object数组是否相等方法实例
2019/11/11 Javascript
Python魔术方法详解
2015/02/14 Python
python检查字符串是否是正确ISBN的方法
2015/07/11 Python
pycharm安装及如何导入numpy
2020/04/03 Python
Python脚本调试工具安装过程
2021/01/11 Python
Myprotein蛋白粉美国官网:欧洲畅销运动营养品牌
2016/11/15 全球购物
W Concept美国:精选全球独立设计师
2017/02/22 全球购物
运动会广播稿500字
2014/01/28 职场文书
小学安全教育材料
2014/02/17 职场文书
《望庐山瀑布》教学反思
2014/04/22 职场文书
入党积极分子学习优秀共产党员先进事迹思想汇报
2014/09/13 职场文书
授权委托书协议书
2014/10/16 职场文书
上课说话检讨书
2015/01/27 职场文书
小王子读书笔记
2015/06/29 职场文书
《纸船和风筝》教学反思
2016/02/18 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python