前两篇文章主要介绍Jquery如何利用Ajax进行操作数据，主要介绍调用的方法；其中Jquery.ajax()是Jquery中最底层的方法；Jquery还定义的一个方法跟几个事件为Jquery.ajax ()进行简化跟扩展；

1：其中全局方法jQuery.ajaxSetup([options])则是为了在使用$.ajax(),有时一个页面需要调用多个$.ajax()方法，如果每个方法都设置其中的请求细节，将是一件十分麻烦的事 。可以一次设置，全局有效，这样大大简化了$.ajax()方法中细节的编写；

实例代码（只需要设置一个$.ajaxSetup(),其它几个地方调用就不用再编写相同的代码）：

<head>

    <title>$.ajaxSetup()方法全局设置Ajax</title>

    <script type="text/javascript" src="Jscript/jquery-1.8.2.min.js">

    </script>

    <script type="text/javascript">

        $(function() {

            $.ajaxSetup({ //设置全局性的Ajax选项

                type: "GET",

                url: "UserInfo.xml",

                dataType: "xml"

            })

            $("#Button1").click(function() { //"姓名”按钮的单击事件

                $.ajax({

                    success: function(data) { //传回请求响应的数据

                        ShowData(data, "姓名", "name"); //显示"姓名"部分

                    }

                })

            })

            $("#Button2").click(function() { //"性别”按钮的单击事件

                $.ajax({

                    success: function(data) { //传回请求响应的数据

                        ShowData(data, "性别", "sex"); //显示"性别"部分

                    }

                })

            })

            $("#Button3").click(function() { //"邮箱”按钮的单击事件

                $.ajax({

                    success: function(data) { //传回请求响应的数据

                        ShowData(data, "邮箱", "email"); //显示"邮箱"部分

                    }

                })

            })

            /*

            *根据名称与值，获取请求响应数据中的某部分

            *@Param d为请求响应后的数据

            *@Param n为数据中文说明字符

            *@Param d为数据在响应数据中的元素名称

            */

            function ShowData(d, n, v) {

                $("#divTip").empty(); //先清空标记中的内容

                var strHTML = ""; //初始化保存内容变量

                $(d).find("User").each(function() { //遍历获取的数据

                    var $strUser = $(this);

                    strHTML += n + "：" + $strUser.find(v).text() + "<hr>";

                })

                $("#divTip").html(strHTML); //显示处理后的数据

            }

        })

    </script>

</head>

<body>

    <div class="divFrame">

         <div class="divTitle">

              <span><input id="Button1" type="button" value="姓名" class="btn" /></span>

              <span><input id="Button2" type="button" value="性别" class="btn" /></span>

              <span><input id="Button3" type="button" value="邮箱" class="btn" /></span>

         </div>

         <div class="divContent">

              <div id="divTip" class="clsShow"></div>

         </div>

    </div>

</body>

</html>

2：在Jquery中，除了全局性的函数外，还有6个全局性的Ajax事件，由于在使用$.ajax()方法时，其中的选项参数global的值默认情况下为true,这也意味着所有在执行的Ajax的数据请求，都绑定了全局事件；也就是说6个全局性的开关是global属性决定；

2.1 ajaxStart(callback)和ajaxStop(callback)这两个使用的频率非常高，前者是当请求开始执行时触发，往往用于编写一些准备性的工作，后者是当请求结束时触发；

实例代码：

<head>

    <title>Ajax中的全局事件</title>

    <script type="text/javascript" src="Jscript/jquery-1.8.2.min.js">

    </script>

    <script type="text/javascript">

        $(function() {

            //元素绑定全局ajaxStart事件

            $("#divMsg").ajaxStart(function() {

                $(this).show(); //显示元素

            })

            //元素绑定全局ajaxStop事件

            $("#divMsg").ajaxStop(function() {

                $(this).html("已成功获取数据。").hide();

            })

            $("#Button1").click(function() {

                $.ajax({ //带参数请求服务器

                    type: "GET",

                    url: "GetData.aspx",

                    //获取加码后的数据并作为参数传给服务器

                    data: { txtData: encodeURI($("#txtData").val()) },

                    dataType: "html",

                    success: function(data) { //显示解码后的返回数据

                        $("#divTip").html(decodeURI(data));

                    }

                })

            })

        })

         </script>

</head>

<body>

    <div class="divFrame">

         <div class="divTitle">

              <span>数据：<input id="txtData" type="text" class="txt" /></span>

              <span><input id="Button1" type="button" value="发送" class="btn" /></span>

         </div>

         <div class="divContent">

              <div id="divMsg" class="clsTip">正在发送数据请求…</div>

              <div id="divTip" class="clsShow"></div>

         </div>

    </div>

</body>

</html>

其中GetData.aspx代码：

    string strName = Request["txtData"]; //返回传回的参数

    Response.Write(strName); //返回传回的参数

感谢您的阅读，坚持每天进步一点点，离成功就更新一步；希望文章对您有所帮助；

最近有个妹子弄的一个关于扩大眼界跟内含的订阅号，每天都会更新一些深度内容，在这里如果你感兴趣也可以关注一下(嘿对美女跟知识感兴趣)，当然可以关注后输入：github 会有我的微信号，如果有问题你也可以在那找到我；当然不感兴趣无视此信息；

Jquery重新学习之九[Ajax运用总结C]的更多相关文章

  1. jQuery源代码学习之九—jQuery事件模块

    jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...

  2. jQuery学习笔记之Ajax用法详解

    这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...

  3. Jquery重新学习之七[Ajax运用总结A]

    Jquery中Ajax的运用是另外一个重点,平时项目经常会用它进行一些异步操作:其核心是通过XMLHttpRequest对象以一种异步的方式,向服务器发送数据请求,并通过该对象接收请求返回的数据,从而 ...

  4. 第十九篇 jQuery初步学习

    jQuery 初步学习   jQuery可以理解为是一种脚本,需要到网上下载,它是一个文件,后缀当然是js的文件,它里面封装了很多函数方法,我们直接调用即可,就比方说,我们用JS,写一个显示与隐藏,通 ...

  5. jQuery学习小结3——AJAX

    一.jQuery的Ajax方法 jQuery对Ajax 做了大量的封装,使用起来也较为方便,不需要去考虑浏览器兼容性.对于封装的方式,jQuery 采用了三层封装: 最底层的封装方法为——$.ajax ...

  6. jQuery学习笔记（Ajax）

    jQuery对Ajax操作进行了封装,在jQuery中$.ajax方法属于最底层的方法,第2层是$.load().$.get().$.post()方法,第3层是$.getScript()和$.getJ ...

  7. bootstrap-data-target触发模态弹出窗元素的data使用 data-toggle与data-target的作用 深入ASP.NET MVC之九:Ajax支持 Asp.Net MVC4系列--进阶篇之AJAX

    bootstrap-data-target触发模态弹出窗元素的data使用 时间:2017-05-27 14:22:34      阅读:4479      评论:0      收藏:0      [ ...

  8. 第26篇 jQuery 快速学习下

    前面说了下jQuery了,大部分说的都是选择器和过滤器方面的东西,这个写完后,后面就说下剩下的东西了,离目标越来越近了.下面就说说这些东西 事件 传统比较 在js中说了原生js的绑定事件,基本的形式如 ...

  9. jQuery框架学习第十一天：实战jQuery表单验证及jQuery自动完成提示插件

    jQuery框架学习第一天:开始认识jQueryjQuery框架学习第二天:jQuery中万能的选择器jQuery框架学习第三天:如何管理jQuery包装集 jQuery框架学习第四天:使用jQuer ...

随机推荐

  1. php回溯

    $sl = debug_backtrace(); 返回的$sl 是一个二维数组 包含如下元素: function string 当前的函数名,参见: __FUNCTION__. line intege ...

  2. php 对二维数组的某个字段公用排序的方法

    function array_sort($arr ,$keys,$order=0){ if(!is_array($arr)){ return false; } $keysvalue=array(); ...

  3. [转]HorizontalScrollView介绍--支持水平滚动的android布局容器

    类概述 用 于布局的容器,可以放置让用户使用滚动条查看的视图层次结构,允许视图结构比手机的屏幕大.HorizontalScrollView是一种 FrameLayout(框架布局),其子项被滚动查看时 ...

  4. CROC 2016 - Qualification B. Processing Queries 模拟

    B. Processing Queries 题目连接: http://www.codeforces.com/contest/644/problem/B Description In this prob ...

  5. FLV视频在IIS6.0下不能播放 处理的方法

    FLV视频在IIS6.0下不能播放 Flash视频由于其较高的压缩率和优越的下载速度,前景普遍看好,同时也为Flash课件增色不少.然而,在FLV视频播放中,却有两个头痛的问题    一.FLV视频在 ...

  6. 对 dpif_class 结构体的一点认识

         类 dpif_class 抽象的是OVS交换机用户空间和内核层datapath的通信接口(通过netlink),分层是出于性能和生产效率的考虑,通过接口dpif_class,用户层ovs-v ...

  7. ffmpeg的IO操作

    ffmpeg 可以通过IO操作将数据读取和存储在文件或网络中 作为数据的读取和写入地址,数据被存放在file,http, ffmpeg 不仅可以编解常用的音视频格式,还可以将数据导入/导出到各种媒介中 ...

  8. WebKit 在 Windows 平台下编译小结

    虽然WebKit 已经越来越多的被广大程序员接受,但其编译过程却非常之痛苦.下面将我编译WebKit 代码的经验与大家分享. 1) 获取WebKit 源代码 WebKit 源代码是使用Subversi ...

  9. iOS开发之UITextField 左侧设置小图标 leftview

    设置用户登录的时候,这个是避免不了,实现方法很多,我个人主张,系统有提供就使用系统,一来方便,二来运行效率高 Paste_Image.png 实现代码如下: pwdTextField.placehol ...

  10. 数学图形(2.9) Capareda曲线

    还是绕在球上的线圈 #http://www.mathcurve.com/courbes3d/capareda/capareda.shtml vertices = t = to (*PI) q = ra ...