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 扩展对input的一些操作方法
Oct 30 Javascript
js 与 php 通过json数据进行通讯示例
Mar 26 Javascript
浅谈Javascript数组索引
Jul 29 Javascript
jQuery Validate表单验证入门学习
Dec 18 Javascript
js 将input框中的输入自动转化成半角大写(税号输入框)
Feb 16 Javascript
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
Angular实现的简单定时器功能示例
Dec 28 Javascript
vue2.0+koa2+mongodb实现注册登录
Apr 10 Javascript
javascript、php关键字搜索函数的使用方法
May 29 Javascript
JavaScript计算正方形面积
Nov 26 Javascript
Vue实现指令式动态追加小球动画组件的步骤
Dec 18 Vue.js
vue3.0 自适应不同分辨率电脑的操作
Feb 06 Vue.js
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
WebQQ最新登陆协议的用法
2014/12/22 PHP
PHP中include/require/include_once/require_once使用心得
2016/08/28 PHP
浅谈PHP的排列组合(如输入a,b,c 输出他们的全部组合)
2017/03/14 PHP
Dom 结点创建 基础知识
2011/10/01 Javascript
Javascript倒计时页面跳转实例小结
2013/09/11 Javascript
jQuery中serializeArray()与serialize()的区别实例分析
2015/12/09 Javascript
7个jQuery最佳实践
2016/01/12 Javascript
基于jQuery仿淘宝产品图片放大镜特效
2020/10/19 Javascript
AngularJS实现一次监听多个值发生的变化
2016/08/31 Javascript
vue使用websocket的方法实例分析
2019/06/22 Javascript
vue实现百度语音合成的实例讲解
2019/10/14 Javascript
稍微学一下Vue的数据响应式(Vue2及Vue3区别)
2019/11/21 Javascript
24个解决实际问题的ES6代码片段(小结)
2020/02/02 Javascript
vue请求数据的三种方式
2020/03/04 Javascript
Vue结合路由配置递归实现菜单栏功能
2020/06/16 Javascript
Python实现爬取逐浪小说的方法
2015/07/07 Python
django开发之settings.py中变量的全局引用详解
2017/03/29 Python
Python读取Word(.docx)正文信息的方法
2018/03/15 Python
python xlsxwriter库生成图表的应用示例
2018/03/16 Python
Python中调用其他程序的方式详解
2019/08/06 Python
python操作docx写入内容,并控制文本的字体颜色
2020/02/13 Python
python安装和pycharm环境搭建设置方法
2020/05/27 Python
新版Pycharm中Matplotlib不会弹出独立的显示窗口的问题
2020/06/02 Python
pycharm软件实现设置自动保存操作
2020/06/08 Python
OpenCV利用python来实现图像的直方图均衡化
2020/10/21 Python
Linux系统下升级pip的完整步骤
2021/01/31 Python
使用css3背景渐变中的透明度来设置不同颜色的背景渐变
2014/03/31 HTML / CSS
html5 Canvas画图教程(2)—画直线与设置线条的样式如颜色/端点/交汇点
2013/01/09 HTML / CSS
英国简约舒适女装品牌:Great Plains
2018/07/27 全球购物
介绍一下sql server的安全性
2014/08/10 面试题
办公室秘书自我鉴定
2014/01/18 职场文书
创先争优一句话承诺
2014/05/29 职场文书
毕业生求职信范文
2014/06/29 职场文书
乡镇党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
就业导师推荐信范文
2015/03/27 职场文书
自信主题班会
2015/08/14 职场文书