zoukankan      html  css  js  c++  java
  • Ajax在jQuery中的应用($.ajax()方法)

    Ajax() 方法

    • $.ajax() 中的参数及使用方法

        在jQuery中,$.ajax() 是最底层的方法,也是功能最强的方法。$.get()、$.post()、$.getScript()、getJSON() 都是在此方法上建立的。

        $.ajas([options])

    $.ajax() 的参数列表
    参数名 类型 功能描述
    url String 发送请求的地址
    type String 数据请求的方式(post 或 get),默认为get
    data String 或 object 发送到服务器的数据。如果不是字符串则自动转成字符串,如果是get方式,那么,该字符串将附在url的后面
    dataType String

    服务器返回的数据类型,如果没有指定,jQuery将自动根据 HTTP 包 MIME 信息自动判断,服务器返回的数据根据自动判断的结果进行解析,传递给回调函数。其可用类型为:

      html:返回纯文本的 HTML 信息,包含的 Script 标记会插入页面时执行

      script:返回纯文本 JavaScript 代码

    beforeSend Function 该函数用于发送请求前修改 XMLHttpRequest 对象,其中的参数就是 XMLHttpRequest 对象,由于该函数本身是jQuery事件,因此,如果函数返回 false ,则表示取消本次请求
    complete Function 请求完成后调用的回调函数,该函数无论数据发送成功或失败都会调用,其中有两个参数,一个是 XMLHttpRequest 对象另一个是strStatus,用于描述成功请求类型的字符串
    success Function 请求成功后调用的回调函数,该函数有两个参数,一个是根据参数 dataType 处理后服务器返回的数据,另一个是 strStatus 用于描述状态的字符串
    error Function 请求失败后调用的回调函数,该函数有三个参数,第一个是 XMLHttpRequest 对象,第二个是出错信息strError,第三个是捕捉到的错误对象 strObject
    timeout Number 请求超时的时间(毫秒),该设置将覆盖 $.ajax() 方法中的同样设置
    global Boolean 是否响应全局事件,默认是true,表示响应,如果设置成false,表示不响应。那么,全局事件 $.ajax() 等将不响应
    async Boolean 是否异步请求,默认为 true ,表示异步,如果设置为 false,表示同步请求
    cache Boolean 是否进行页面缓存,true 表示进行缓存,false表示不进行缓存
    //ajax
                $.ajax({
                    url: "@Url.Action("AjaxTest","Ajax")",
                    //自动识别返回数据类型
                    //dataType: "JSON",
                    data: {
                        name: $("input[name=name]").val(),
                        pwd: $("input[name=pwd]").val(),
                        email: $("input[name=email]").val()
                    },
                    success: function (data) {
                        if (data!=null) {
                            var strHTML = "";
                            //strHTML += "name:" + data["name"] + "<br>";
                            //strHTML += "sex:" + data["sex"] + "<br>";
                            //strHTML += "email:" + data["email"] + "<hr>";
                            strHTML += "name:" + data.name + "<br>";
                            strHTML += "sex:" + data.pwd + "<br>";
                            strHTML += "email:" + data.email + "<hr>";
                            $("#tip").html(strHTML);
                        } else {
                            alert("请求失败!");
                        }
                    },
                    error: function () {
                        alert("请求失败!");
                    }
                })
    • $.ajaxStetup() 设置全局 Ajax

        

    //ajaxsetup
            $.ajaxSetup({
                //设置全局属性的Ajax选项,什么是全局就添加什么
                url: "@Url.Action("AjaxTest","Ajax")",
                data: {
                     name: $("input[name=name]").val(),
                     pwd: $("input[name=pwd]").val(),
                     email: $("input[name=email]").val()
                },
                error: function () {
                    alert("请求数据失败!");
                }
            })
            $("#btn_ajax").click(function () {
                $.ajax({
                    success: function (user) {
                        var strHTML = "";
                        strHTML += "name:" + user.name + "<br>";
                        strHTML += "sex:" + user.pwd + "<br>";
                        strHTML += "email:" + user.email + "<hr>";
                        $("#tip").append(strHTML);
                    }
                })
            })
            $("#btn_ajax2").click(function () {
                $.ajax({
                    success: function (user) {
                        var strHTML = "";
                        strHTML += "name:" + user["name"] + "<br>";
                        strHTML += "sex:" + user["pwd"] + "<br>";
                        strHTML += "email:" + user["email"] + "<hr>";
                        $("#tip").append(strHTML);
                    }
                })
            })

    Ajax中的全局事件

    Ajax中的全局事件
    事件名称 参数 功能描述
    ajaxComplete(callback) callback Ajax 请求完成时执行函数
    ajaxError(callback) callback Ajax 请求发生错误时执行函数,其中捕捉到的错误作为最后一个参数进行转换
    ajaxSend(callback) callback Ajax 请求发送前执行函数
    ajaxStart(callback) callback Ajax 请求开始时执行函数
    ajaxStop(callback) callback Ajax 请求结束时执行函数
    ajaxSuccess(callback) callback Ajax 请求成功时执行函数
  • 相关阅读:
    django.db.utils.OperationalError: no such table: auth_user
    Python 爬虫 去掉网页注释,去掉网页注释
    Python 爬虫实例(6)—— 爬取蚂蚁免费代理
    HTTPSConnectionPool(host='xxxxx', port=443): Max retries exceeded with url:xxxxxxxx (Caused by NewConnectionError('<urllib3.connect,Max retries exceeded with ,(Caused by NewConnectionError
    requests.exceptions.MissingSchema: Invalid URL 'xxxxxxxxxxxxx': No schema supplied. Perhaps you meant xxxxxxxxxxxxx
    redis安装和配置(一)
    Python 统计代码的行数,Python脚本 统计代码
    Python 实现根据不同的程序运行环境存放日志目录,Python实现Linux和windows系统日志的存放
    Changing SID Server 2012
    [转]VMware Workstation网络连接的三种模式
  • 原文地址:https://www.cnblogs.com/Akeke/p/6518767.html
Copyright © 2011-2022 走看看