• 关于jQuery中的ajax的方法介绍


           jQuery提供一系列Ajax函数方便我们调用Ajax, 其中最核心也是最复杂的是jQuery.ajax(),所有的其他Ajax函数都是它的一个简化调用.当我们想要完全控制Ajax时可以使用此结果, 否则还是使用简化方法如get, pos等更加方便. 所以jQuery.ajax(  ) 方法放到最后一个介绍, 先来介绍上层简单方法,值得注意的是Ajax方法必须要在服务器上运行。
     
     
    1、$(parent).load( url [, data] [, callback]); 

    请求一个HTML页面,并替换为parent的innerHTML

     
    例子:
    1 $(function (){ 
    2 $("input").click(function (){
    3 var index=$(this).index();
    4 $("div").eq(index).load("h/a"+(index+1)+".html",function (){
    5 $("div").hide();
    6 $("div").eq(index).show();
    7 });
    8 });
    9 });
    View Code
     
    2、$.get( url [, data] [, callback] [, type]);
    get方式请求指定的url。
    不用解析,变成json对象,直接可用。
     
    1 $(function (){
    2 $.get("h/login2.php",{
    3 user:"wangyue",
    4 pass:"12345"
    5 },function (str){
    6 alert(str);
    7 });
    8 });
    View Code
     
    3、post的方式获取请求
    1 $.post("h/login3.php",{user:"wangyue",pass:"12345"},function (data){
    2 console.log(data);
    3 // alert(data.pan.age);
    4 });
    View Code
     

    4、$.getScript(url [, callback]);

    加载一段JS并执行

    1 $.getScript("h/getJs.js",function (data){
    2 alert(data); //弹的是js文件里的内容
    3 });
    View Code
     
    5、$.getJSON(url [, callback]);
    加载一段JSON并解析
    1 $.getJSON('h/index.json', function(json, textStatus) {
    2 console.log(json);
    3 // alert(textStatus);
    4 });
    View Code
     
     
    6、最基础---$.ajax( options );
    url:发送请求的URL

    type : "get"或"post"
    success: 请求成功后的回调函数
    data 示例: "name=abc&age=19"或 {name:"abc",age:19}

    timeout : 超时时间(毫秒)
    dataType :服务器返回的数据类型。特殊的格式JQ会进行预解析和兼容性修复。可选择的值: "xml" , "html" , "script" , "json" , "jsonp","text"
    beforeSend :在发送请求前,可以添加自定义头部信息等操作。示例: function(xhr){ xhr;//XMLHttpRequest对象 }

    complete:ajax请求完成后的回调函数,无论成功与失败。
    error : 失败的回调函数

     1 $.ajax({
     2 url:"h/login2.php",   //url
     3 type:"get",  //默认get    post
     4 data:{
     5 user:"wangyue",   //发送该服务器的数据 接受的是json类型
     6 pass:"12345"
     7 },
     8 dataType:"json",  //数据类型  jsonp  json html txt  ;不加这属性返回的是字符串,加了能够与解析,返回的是对象
     9 success:function (data){   //成功后回调函数
    10 // alert(data);
    11 console.log(data);
    12 },
    13 error:function (){
    14 alert('失败了');
    15 }
    16 });
    View Code
     
     
     
     1 $.ajax({
     2 url:"http://suggestion.baidu.com/su",
     3 data:{
     4 wd:"x"
     5 },
     6 dataType:"jsonp",
     7 jsonp:"cb",   //回调函数的名字
     8 success:function (data){
     9  
    10 console.log(data);
    11 },
    12 error:function (){
    13 alert("失败了");
    14 }
    15 });
    View Code
  • 相关阅读:
    BZOJ 4358 坑 莫队+线段树 死T
    BZOJ 4321 DP
    两倍问题
    通宵教室
    [编程题]字符串模式匹配
    [编程题]表达式求值
    [编程题]美团骑手包裹区间分组
    1153 Decode Registration Card of PAT
    1154 Vertex Coloring
    1155 Heap Paths
  • 原文地址:https://www.cnblogs.com/Hfive/p/3580401.html
Copyright © 2020-2023  润新知