以下介绍Jquery中  Post   Get   Ajax几种异步请求的使用方法 

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Jquery异步请求.WebForm1" %>

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server">

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <script src="jquery-2.0.3.js" type="text/javascript"></script>

     <title></title>

     <script type="text/javascript">

         $(function () {

             //  $.post("Student.ashx", "", function () { },"json");

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

                 var id = $("#stuID").val();

                 //data:    返回的数据：XML/JSON/HTML等

                 //textStatus:  请求状态：success/error/notmodified/timeout 4种 

                 //$.get("GetStudent.ashx", {"id":id}, function (data, textStatus) {

                 //    $.each(data, function (i,value) {

                 //        alert(value["Name"]);

                 //    });

                 //},"json");

                 //    $.post("GetStudent.ashx", {"id": id}, function (data, textStatus) {

                 //        $.each(data, function (i,item) {

                 //            alert(item.Name);

                 //        });

                 //    },"json");

                 //})

                 //alert(responseText);//请求返回的内容

                 //alert(textStatus);//请求状态：success，error

                 //alert(XMLHttpRequest);//XMLHttpRequest对象

                 //全局事件是每次的Ajax请求都会触发的，

                 $.ajax({

                     url: "GetStudent.ashx",                //发送请求的地址

                     type: "Get",                     //请求方式GET/POST，默认GET

                     dataType: "json",                       //预期服务器返回的数据类型

                     global: true,                       //是否触发全局Ajax事件，默认为true（触发）

                     data: { "id": id },             //向服务器发送的数据

                     beforeSend: function (XMLHttpRequest) {

                         //alert("正在加载中");

                         $("#div1").show();

                     },    ///发送请求前调用，可以放一些"正在加载"之类额话

                     complete: function (XMLHttpRequest, textStatus) {

                     },      //请求完成时（成功或失败）

                     success: function (data, textStatus)      //请求成功后的回调函数

                     {

                         $("#div1").hide();

                         $.each(data, function (i, item)    //i：   data中对象成员或数组的索引值

                             //item：  data对应的变量或内容

                         {

                             alert(item.Name);

                         });

                     },

                     error: function (XMLHttpRequest, txtStatus, ErroeThrown) { }     //失败后回调

                 });



                 //fn指回调函数(callback)

                 ajaxStart(fn)

                 ajaxStop(fn)

                 ajaxComplete(fn)

                 ajaxError(fn)

                 ajaxSend(fn)

                 ajaxSuccess(fn)

                 //如果想某个Ajax请求不受全局方式影响

                 $.ajax({

                     global: false

                   })

             })})

     </script>

     <style type="text/css">

          .login{width:200px;border:0px solid #ccc;display:none;position:absolute;top:200px;left:500px;z-index:200}

     </style>

 </head>

 <body>

     <form id="form1" runat="server">

     <div id="div1" class="login">

      <img src="1.gif" />

     </div>

         <input type="text" id="stuID" /><br />

         <input type="button" value="点击按钮" id="btn" />

     </form>

 </body>

 </html>

Jauery 中Ajax的几种异步请求的更多相关文章

  1. jQuery中ajax的4种常用请求方式

    jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数 ...

  2. js中ajax如何解决跨域请求

    js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...

  3. Vue+axios的四种异步请求，参数的携带以及接收

    Vue中axios发送GET, POST, DELETE, PUT四种异步请求,参数携带和接收问题 web.xml配置如下 1.GET请求 发送GET请求: <!--params是关键字,说明所 ...

  4. Python实现接口测试中的常见四种Post请求数据

    前情: 在日常的接口测试工作中,模拟接口请求通常有两种方法, 利用工具来模拟,比如fiddler,postman,poster,soapUI等 利用代码来模拟,使用到一些网络模块,比如HttpClie ...

  5. MVC中使用JQuery方式进行异步请求和使用自带方式进行异步请求

    在MCV中使用异步请求可以很很高效地进行前台和后台的数据传递,在这里,笔者为初学者介绍两种在MVC中常用的异步请求处理方式. 在这里,我们通过在一个页面中放置一个按钮来异步获取当前服务器端的系统时间为 ...

  6. 在Silverlight中的DispatcherTimer的Tick中使用基于事件的异步请求

    需求:在silverlight用户界面上使用计时器定时刷新数据. 在 Silverlight 中的 DispatcherTimer 的 Tick 事件 中使用异步请求数据时,会出现多次请求的问题,以下 ...

  7. JavaScript中Ajax的get和post请求

    AJAX = 异步 JavaScript和XML(Asynchronous JavaScript and XML) 作用:在不重新加载整个网页的情况下,对网页的某部分进行更新.   两种请求方式: 1 ...

  8. JS中Ajax的同步和异步

    ajax同步 : 意味着此时请求Server后,JS代码不再继续执行,等待Server返回后才继续往下执行. ajax异步 : 意味着此时请求Server后,JS代码继续执行,不管Server什么时候 ...

  9. springMVC 中 ajax get 请求和 post 请求的坑以及参数传递

    1, ajax 请求 无论为 post ,或者 get ,url中带有?形式的参数,后台都能以String类型变量接收,变量名称和参数名称必须一致 前台ajax: $.ajax( "prod ...

随机推荐

  1. 2016/3/31 拾遗 php字符串中 转义字符 “ ’‘ ” ’ “” ‘ " \’ ' ' \‘ " " \" '' \ " " 使用

    <?php echo $str_string1='甲问:"你在哪里学的PHP?"'; echo "<br />"; echo $str_str ...

  2. 3.myeclipse 8.5 m1 注册码

    为了能在eclipse 中方便的使用uml,尝试了多次安装各种uml插件未果,myeclipse 自带uml插件,但是要注册啊,要破解啊!!! user:baiduzhidaopassword:oLR ...

  3. vue学习1

    1.<div id="app">{{message}}<input v-model="message"></div>new ...

  4. Windows 异步IO操作

    Windows提供了4种不同的方法来接收I/O请求已经完成的通知:触发设备内核对象.触发事件内核对象.可提醒I/O和I/O完成端口. Windows的异步I/O     当线程向设备发起一个I/O异步 ...

  5. JDBC各种数据库连接URL关键代码

    通过JDBC连接数据库时,各个数据库有着不同的URL格式,为了方便大家使用,我在以下提供了常见的7种数据库连接示例代码,请根据实际需要进行相应的更改. 1.Oracle数据库 Class.forNam ...

  6. Ubuntu18开启redis服务自启动

    设置redis服务开机自启动. 1.创建配置文件夹 sudo mkdir /etc/redis sudo cp /usr/local/redis/redis.conf /etc/redis sudo ...

  7. SWFObject 的基本使用方法

    SWFObject是一个用于在HTML中方面插入Adobe Flash媒体资源(*.swf文件)的独立.敏捷的JavaScript模块.该模块中的JavaScript脚本能够自动检测PC.Mac机器上 ...

  8. ACTION 中 单表查询语句 SQL写法

    JSP页面 <tr> <td class="STYLE1"> <div align="center"> // 单击事件 调用 ...

  9. HDU - 4333 Revolving Digits（拓展kmp+最小循环节）

    1.给一个数字字符串s,可以把它的最后一个字符放到最前面变为另一个数字,直到又变为原来的s.求这个过程中比原来的数字小的.相等的.大的数字各有多少. 例如:字符串123,变换过程:123 -> ...

  10. 给Xcode增加复制行、删除行快捷键的方法

    运行: sudo chmod 666 /Applications/Xcode.app/Contents/Frameworks/IDEKit.framework/Resources/IDETextKey ...