jq-ajax -云博客

jq-ajax

# 前端 2024-05-05 05:15 0 22 来源：云博客

常用属性集合

 $.ajax({ url:url, data:{}, type:"get", success:function(){}, timeout:2000, error:function(){}, beforeSend:function(){}, dataType:"jsonp", //跨域必要加 jsonp:"cb", // 是否触发ajax的全局方法 global:true })

分类

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title></head><body> 正在测试jq-ajax方法<br> <input type="text" id="user"> <input type="text" id="pass"> <input type="button" id="btn"></body><script src="../jquery.js"></script><script> $("#btn").click(function(){ var url = "http://localhost/1908/jq-ajax/data/data.php"// 最简化的ajax $.ajax({ url:url, success:function(res,type,xhr){ console.log(res) }
　　　　　　　　data：{user:$("#user").val(),pass:$("#pass").val() }
 }) // 超时的ajax $.ajax({ url:url, success:function(res,type,xhr){ console.log(res) console.log(type) console.log(xhr) }, error:function(a,b,c){ console.log(a,b,c) }, timeout:10 }) // loading的ajax var img; $.ajax({ url:url, success:function(res,type,xhr){ img.remove() console.log(res) }, beforeSend:function(){ //在成功收到传过来的数据之前 img = $("<img src=‘1.gif‘>"); $("body").append(img); } }) // 跨域的ajax，同时具有loading var jsonpUrl = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su"; //百度接口 var img; $.ajax({ url:jsonpUrl, data:{ wd:$("#user").val() }, success:function(res,type,xhr){ img.remove() //成功返回数据时就消失 console.log(res) }, dataType:"jsonp", jsonp:"cb", beforeSend:function(){ img = $("<img src=‘1.gif‘>"); $("body").append(img); } }) // 触发或不触发全局方法的ajax $(document).ajaxSuccess(function(){ alert("ajax成功了") }) $(document).ajaxSend(function(){ alert("ajax执行了发送") }) $(document).ajaxStart(function(){ alert("ajax开启了") }) $.ajax({ url:url, success:function(res,type,xhr){ console.log(res) }, global:true表示触发 false表示不触发  }) // 自动解析json数据 var jsonUrl = "http://localhost/1908/jq-ajax/data/json.php" $.ajax({ url:jsonUrl, success:function(res,type,xhr){ console.log(res) }, dataType:"json" //自动将json中的数据以数组的形式输出来。 }) })</script></html>

若是一个ajax所执行成功的操作与json的位置...许多公共属性都一样。可以设置一个公共类，输出不同的数据就可以了

 $.ajaxSetup({  //公共代码 url:"http://localhost/1908/jq-ajax/data/data.php", success:function(res,type,xhr){ console.log(res) } }) $.ajax({ data:{ user:"admin", pass:"123" } }) $.ajax({ data:{ user:"admin", pass:"123456" } })