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

四、实例:

//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);
  }
});

//5.done的使用

$.ajax({
    type:'get',
    async:false,
    url:this.topUrl + 'sbjctDmnInfo/queryVrsnCD.action?rnd=' + Math.random()
    }).done(function(data){
      if (data.retcode == '0000') {
        aplnCommon.rightTreeSearchObj.dataVrsnId = data.obj[0].vrsnId;
        func1();
      }
  });

随机推荐

  1. 关于IOS项目QQ空间授权提示安装最新版本的QQ的解决方法!

  2. SLF4J 简单日志门面 介绍和使用

    参考:http://singleant.iteye.com/blog/934593        http://liuzidong.iteye.com/blog/776072 介绍: 简单日记门面(s ...

  3. Linux 如何实现 VLAN

    LAN 表示 Local Area Network,本地局域网,通常使用 Hub 和 Switch 来连接 LAN 中的计算机.一般来说,两台计算机连入同一个 Hub 或者 Switch 时,它们就在 ...

  4. msp430项目编程46

    msp430综合项目---监控系统46 1.电路工作原理 2.代码(显示部分) 3.代码(功能实现) 4.项目总结

  5. Linux下AT&T汇编语法格式与Intel汇编语法格式异同

    由于绝大多数的国内程序员以前只接触过Intel格式的汇编语言,很少或几乎没有接触过AT&T汇编语言,虽然这些汇编代码都是Intel风格的.但在Unix和Linux系统中,更多采用的还是AT&a ...

  6. Google解决跨域

    1.添加   --disable-web-security --user-data-dir=D:\tmp 2.在D的根目录新建tmp文件夹

  7. android layout

    android的视图分为两类,一类是布局,另一个类是控件 一.LinearLayout(线性布局) 最常用布局之一,线性布局的特性是每添加一个控件默认会在上个控件的下面占一行. <LinearL ...

  8. (4)Swing布局

    一.FlowLayout-流布局 新增第一个组件后默认在第一行的居中位置,之后 组件按照加入的先后顺序按照设置的对齐方式从左向右排列 二.borderLayout-边框布局 容器划分为东.西.南.北. ...

  9. 小窥React360——用React创建360全景VR体验

    前言    混迹VR届的发烧友兼开发者们一定不要错过这款FaceBook推出的跨端VR开发框架——React360,称为360全景体验框架更为准确,因为其前身是FaceBook和Oculus2017年 ...

  10. codevs——1501 二叉树最大宽度和高度

    1501 二叉树最大宽度和高度  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 白银 Silver 题解       题目描述 Description 给出一个二叉树,输出它的 ...