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实现模拟页面加载进度条
Apr 01 Javascript
jquery触发a标签跳转事件示例代码
Jul 21 Javascript
浅谈Javascript 执行顺序
Dec 18 Javascript
js 数组操作之pop,push,unshift,splice,shift
Jan 29 Javascript
JavaScript数据类型详解
Apr 01 Javascript
jQuery添加和删除指定标签的方法
Dec 16 Javascript
JavaScript实现自定义媒体播放器方法介绍
Jan 03 Javascript
javascript 初学教程及五子棋小程序的简单实现
Jul 04 Javascript
Vue+mui实现图片的本地缓存示例代码
May 24 Javascript
element-ui表格列金额显示两位小数的方法
Aug 24 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
Aug 03 Javascript
一文帮你理解PReact10.5.13源码
Apr 03 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程序61条面向对象分析设计的经验小结
2008/11/12 PHP
在Mac上编译安装PHP7的开发环境
2015/07/28 PHP
PHP页面转UTF-8中文编码乱码的解决办法
2015/10/20 PHP
PHP生成图片缩略图类示例
2017/01/12 PHP
css3实现背景模糊的三种方式
2021/03/09 HTML / CSS
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
setTimeout和setInterval的区别你真的了解吗?
2011/03/31 Javascript
jQuery代码优化 选择符篇
2011/11/01 Javascript
EasyUI中的tree用法介绍
2011/11/01 Javascript
仿微博字符限制效果实现代码
2012/04/20 Javascript
JQuery中dataGrid设置行的高度示例代码
2014/01/03 Javascript
js中各种类型的变量在if条件中是true还是false
2014/07/16 Javascript
浅谈JSON.parse()和JSON.stringify()
2015/07/14 Javascript
nodejs构建本地web测试服务器 如何解决访问静态资源问题
2017/07/14 NodeJs
解决在vue+webpack开发中出现两个或多个菜单公用一个组件问题
2017/11/28 Javascript
用JS实现根据当前时间随机生成流水号或者订单号
2018/05/31 Javascript
JS动态图片的实现方法完整示例
2020/01/13 Javascript
python多线程socket编程之多客户端接入
2017/09/12 Python
python enumerate函数的使用方法总结
2017/11/15 Python
Python2.7基于笛卡尔积算法实现N个数组的排列组合运算示例
2017/11/23 Python
python里的单引号和双引号的有什么作用
2020/06/17 Python
解决python运行效率不高的问题
2020/07/20 Python
Python lxml库的简单介绍及基本使用讲解
2020/12/22 Python
澳大利亚制造的羊皮靴:Original UGG Boots
2017/11/13 全球购物
垃圾回收的优点和原理。并考虑2种回收机制
2016/10/16 面试题
Oracle的内存结构(Memory structures)
2015/06/10 面试题
请解释流与文件有什么不同
2016/07/29 面试题
打架检讨书400字
2014/01/17 职场文书
企业安全生产责任书范本
2014/07/28 职场文书
实习协议书范本
2014/09/25 职场文书
行政执法队伍作风整顿剖析材料
2014/10/11 职场文书
一次性工伤赔偿协议书范本
2014/11/25 职场文书
拖欠货款起诉状
2015/05/20 职场文书
学习经验交流会总结
2015/11/02 职场文书
高一作文之暖冬
2019/11/09 职场文书
Python 绘制多因子柱状图
2022/05/11 Python