zoukankan      html  css  js  c++  java
  • 关于Jquery Ajax的用法

      今天简单描述一下Jquery Ajax的用法,和我在使用过程中的一些看法,仅供自己娱乐和大家参考值之用!

      Jquery Ajax的重要性不言而喻,只从Jquery面世之后,终于解救了像我这种既做前台又做后台,还艰难的学着JavaScipt的苦逼程序猿啊!废话不多说,直接进入主题。

      Jquery Ajax的方法有好几个,例如:Load()、Get()、Post()等等,但是最重要的就是Ajax()方法了。他是这些方法的底层,而且其他的方法都能使用Ajax()方法来实现,所以今天就记录一下对Ajax()方法的看法。Jquery Ajax()方法的参数有下面几个:

      1、url:发送请求的地址

      2、type:请求方式(Get或Post)

      3、data:发送到服务器的数据。对象必须为key/Value格式,例如{UserName:"admin",Password:"admin"},若为Get将转换为&UserName=admin&Password=admin。如果是数组,将自动为不同值对应同一个名称,例如{UserName:["admin1","admin2"]}转换为&UserName=admin1&UserName=admin2

      4、dataType:预期服务器返回的数据类型,如果不指定,Jquery将自动根据HTTP包MIME信息返回responseXML或responseText,并作为回调函数参数传递

              可用类型如下:

              XML:返回XML文档,可用Jquery处理

              HTML:返回纯文本HTML信息;包换的script标签会在插入DOM时执行

              script:返回纯文本JavaScipt代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时(不在同一个域下),所有POST请求豆浆转换为GET请求

                             json:返回JSON数据

                             text:返回纯文本字符串

             jsonp:。。。。。。

                      jquery:。。。。。。

      5、beforeSend:发送请求之前发生的动作,例如:

               function(XMLHttpRequest){this;}

      6、complete:请求完成后调用的会调函数(请求成功或失败时均调用),参数:XMLHttpRequest对象和一个描述成功请求类型的字符串,例如:

              function(XMLhttpRequest,textStatus){this;}

      7、success:请求成功后调用的回调函数,有两个函数:

            (1) 由服务器返回,并根据dataType参数进行处理后的数据

            (2) 描述状态的字符串

            例如:function(data,textStatus){

               //data 可能是html,text,json等等           

               }

      8、请求失败时调用的函数。该函数有3个参数

        例如:

        function(XMLHttpRequest,textStatus,errorThrown){this;}

        XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。

      接下来写个实际的例子,一个登陆验证用户名和密码的例子:

    $.ajax({
    type: 'POST',  //提交方式
    url: 'ValidateLogin.ashx',  //提交的URL的地址
    data: {
    UserName: $('#LoginAndRegDialog input[name=name]').val(),
    Password: $('#LoginAndRegDialog input[name=password]').val(),  //提交的数据,注意这种写法
    },
    cache: false,
    dataType: 'Json',   //返回的数据类型为Json
    beforeSend: function () {   //提交之前执行的动作
    $("#DivLoading").text("正在查询...");
    },
    error: function () {  //提交出现错误时执行的动作
    $.messager.alert('提示信息', '链接出现错误!');
    },
    success: function (data) {  //提交成功返回数据时执行的动作
    if (data.result == "success") {
    $('#LoginAndRegDialog').dialog('close');
    $.messager.show({
    title: '提示',
    msg: data.result,
    });
    }
    else {
    $.messager.alert('提示', '用户名密码错误!');
    }

    },
    complete: function () {//提交完成时执行的动作
    $('#DivLoading').hide();
    },
    });

     

    在这里有几点需要注意:

    1、请求地址这里写的是一般处理程序(.ashx),当然也可以换成是.aspx,不过如果是.aspx的话,.aspx的前台不能包含任何代码。

    2、如果设置的返回的数据是Json的话,返回的数据一定要保证是Json数据,即{"UserName":"admin","Password":"admin"},切记啊!

    3、Json是一个对象,所以有属性之说,即可以.出来属性,已获得属性的值,如果点不出来的话,可能是字符串的类型,这个时候就需要转换为Json格式了,Eval和ParseJson都可以做到

    主要的就是这些吧,以后有更多的想法再补上!多谢

  • 相关阅读:
    文件的基本操作(1)
    ajax实现分页和分页查询
    ajax 实现三级联动下拉菜单
    ajax 实现加载页面、删除、查看详细信息,以及bootstrap网页的美化
    ajax 实现页面加载和内容的删除
    ajax 写登录
    jquery 的基础知识,以及和Javascript的区别
    PHP 实现简单购物车功能(2)
    php 实现简单加入购物车
    《zw版·Halcon-delphi系列原创教程》 Halcon分类函数014,tuple,元组
  • 原文地址:https://www.cnblogs.com/lin714115/p/3210279.html
Copyright © 2011-2022 走看看