JQuery Ajax

function test_ajax(){
   $.ajax(
   {
      type:"GET",//通常会用到两种：GET,POST。默认是：GET
      url:"a.php",//(默认: 当前页地址) 发送请求的地址
      dataType:"html",//预期服务器返回的数据类型。
      beforeSend:beforeSend, //发送请求
      success:callback, //请求成功
      error:error,//请求出错 
      complete:complete//请求完成
   });
}
function error(XMLHttpRequest, textStatus, errorThrown){
  // 通常情况下textStatus和errorThown只有其中一个有值 
  $("#showResult").append("<div>请求出错啦！</div>");
}
function beforeSend(XMLHttpRequest){
  $("#showResult").append("<div><img src='https://blog.csdn.net/yonghutwo/article/details/loading.gif' /><div>");
}
function complete(XMLHttpRequest, textStatus){
  $("#showResult").remove();
}
function callback(msg){
  $("#showResult").append("<div>请求成功，回传数:" msg "<div>");
}
--------------------设置同步异步--------------------

$.post() 和 $.get() 如何同步请求

由于$.post() 和 $.get() 默认是 异步请求，如果需要同步请求，则可以进行如下使用：

在$.post()前把ajax设置为同步：$.ajaxSettings.async = false;

在$.post()后把ajax改回为异步：$.ajaxSettings.async = true;

原文链接：https://blog.csdn.net/sunnyzyq/article/details/78730894
————————————————

----------post请求----------------------
$.ajax({
            url:httpUrl "/api/auth/login",
            type:"post",    //请求方式
            data:JSON.stringify(form),
            contentType:"application/json",  //缺失会出现URL编码，无法转成json对象
            
            success:function(data){
                
            },
            error: function (e) {//请求失败，包含具体的错误信息
              
           },complete: function (XMLHttpRequest,status) {

           }
        });

--------------------get 请求----------------------------
$.ajax({
                type: "GET",
                contentType: "application/json;charset=UTF-8",
                url: httpUrl "/find",
                data: "",
                dataType: 'json',
                success: function (result) {

                },
                error: function (e) {//请求失败，包含具体的错误信息
                    console.error(e.status);
                    console.error(e.responseText);
                    swal("网络错误","","error");
                }
            });

$.ajax({
    url: httpUrl '/findTable/' sourceTable,
    type: 'get',
    async: false,    //默认设置为true，所有请求均为异步请求。
    dataType: 'json',
    success: function (res) {
       
    },
    error: function (XMLHttpRequest) {
        
    }
    });

$.ajax({
    url: httpUrl "/matedata/scheduler/unusual/discard/" id,
    type: "get",
    success: function (res) {
        
    }
});

$.ajax({
    url:httpUrl "/matedata/itfs/ele/queryElectricityByCustomerNo" '?auth_id=' authId,
    type:"get",
    timeout: 1000,    //设置本地的请求超时时间（以毫秒计）。此设置将覆盖$.ajaxSetup()方法的全局设置。
    success:function(data){
        
    },
    error: function (e) {//请求失败，包含具体的错误信息
        swal("网络错误","","error");
    },
    complete: function (XMLHttpRequest,status) {
        
    }
});

--发送json

let dirAbsolutePath = $('#goParentPath').attr('value')

                    let param = {'dirAbsolutePath': dirAbsolutePath, 'dirName': dirName}

                    $.ajax({

                        url: httpUrl '/api/manage/dir/create',

                        type: 'get',

                        dataType: 'json',

                        data:param,

                        success: function (res) {

                            if(res.code==0){

                            }else{

                                lightyear.notify('服务异常', 'warning', 100, 'mdi mdi-emoticon-sad', 'top','');

                            }

                        },

                        error: function (e) {

                            console.log(e.status);

                            console.log(e.responseText);

                            lightyear.notify('网络错误', 'danger', 100, 'mdi mdi-emoticon-sad', 'top','');

                        },

                        complete: function (XMLHttpRequest,status) {

                        }

                    });

服务器接收：@RequestParam String dirAbsolutePath, @RequestParam String dirName

------------put 请求--------------

$.ajax({

                url:httpUrl "front",

                type:"put",

                data:JSON.stringify(json),

                contentType:"application/json",  //缺失会出现URL编码，无法转成json对象

                success:function(data){

                }

            });

-----------delete 请求---------------

$.ajax({

                    type: "DELETE",

                    contentType: "application/json;charset=UTF-8",

                    url: httpUrl "/Domain/" id,

                    data: JSON.stringify({}),

                    success: function (result) {

                    },

                    //请求失败，包含具体的错误信息

                    error: function (e) {

                        console.log(e.status);

                        console.log(e.responseText);

                        layer.msg("网络错误");

                    }

                });

-----------------------------

$.ajaxFrom方法：

1.  
   $('form').ajaxFrom({
2.  
   target : '#result',
3.  
   beforeSubmit : function(formData, jqForm, options){
4.  
   console.log(options);
5.  
   },
6.  
   success : function(responseText, statusText){
7.  
   console.log(responseText);
8.  
   }
9.  
   });
10.  
     
11.  
     
12.  
    $.ajax({
13.  
    type: 'POST',
14.  
    url: '/upload',
15.  
    data: new FormData($('from')[0]), //带文件的form表单
16.  
    contentType: false,
17.  
    processData: false,
18.  
    success: function (result) {
19.  
    console.log(result);
20.  
    },
21.  
    error: function (err) {
22.  
    console.log(err);
23.  
    }
24.  
    });

$.fileupload方法：

1.  
   $('#fileupload').fileupload({
2.  
   dataType: 'json',
3.  
   done: function (e, data) {
4.  
   console.log(JSON.stringify(data));
5.  
   }
6.  
   });
7.  
    
8.  
   var fd = new FormData();
9.  
   fd.append('file', $('#fileupload')[0].files[0]);
10.  
    fd.append('file2', new File([fileBlob], 'filename.txt'));
11.  
    $.ajax({
12.  
    type: 'POST',
13.  
    url: '/upload',
14.  
    data: fd,
15.  
    contentType: false,
16.  
    processData: false,
17.  
    success: function (result) {
18.  
    console.log(result);
19.  
    },
20.  
    error: function (err) {
21.  
    console.log(err);
22.  
    }
23.  
    });

回调函数
如果要处理 $.ajax() 得到的数据，则需要使用回调函数：beforeSend、error、dataFilter、success、complete。

beforeSend
在发送请求之前调用，并且传入一个 XMLHttpRequest 作为参数。
beforeSend: function(XMLHttpRequest){
  
}
error
在请求出错时调用。传入 XMLHttpRequest 对象，描述错误类型的字符串以及一个异常对象（如果有的话）
error: function (e) {//请求失败，包含具体的错误信息 error(xhr,status,error)
               console.log(e.status);
               console.log(e.responseText);
               lightyear.notify('网络错误', 'danger', 100, 'mdi mdi-emoticon-sad', 'top','');
           },
dataFilter
在请求成功之后调用。传入返回的数据以及 "dataType" 参数的值。并且必须返回新的数据（可能是处理过的）传递给 success 回调函数。
dataFilter:function(data, type){
    return data;
}
success
当请求之后调用。传入返回后的数据，以及包含成功代码的字符串。
success:function(data){    //success(result,status,xhr)
    if(data.code==0){
        
    }else if(data.code==-1){
        console.error(data.message);
    }else{
        lightyear.notify(data.message, 'danger', 100, 'mdi mdi-emoticon-sad', 'top','');
    }
},

complete
当请求完成之后调用这个函数，无论成功或失败。传入 XMLHttpRequest 对象，以及一个包含成功或错误代码的字符串。
,complete: function (XMLHttpRequest,status) {
               
           }

------其他文件上传查看 文件上传的文章-----------

这篇好文章是转载于：学新通技术网