以下介绍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. jQuery操作Form表单元素

    Web开发中常常须要操作表单,form表单元素有select.checkbox.radio.textarea.button.file.text.hidden.password等. 当中checkbox ...

  2. arcgis 发布地图服务

    arcgis中,地图文档需要发布,才能为WEB所用. 咋发布呢? 1.在arcmap里面,点击 文件 - 共享为 - 服务 2.在弹出的对话框里选"发布服务",然后 3.这里面有点 ...

  3. jfreechart应用1--环境配置

    jfreechart应用1--环境配置 JFreeChart是一组功能强大.灵活易用的Java绘图API,使用它可以生成多种通用性的报表,包括柱状图.饼图.曲线图.甘特图等.它能够用在Swing和We ...

  4. hdu-4118 Holiday's Accommodation(树形dp+树的重心)

    题目链接: Holiday's Accommodation Time Limit: 8000/4000 MS (Java/Others)     Memory Limit: 200000/200000 ...

  5. 使用VS进行打包程序解决生成两个文件的问题（压缩后只有一个exe）

    使用VS打包创建setup相信大家都挺熟的了,不熟的话网上也有很多,就不做介绍了,现在给大家写下怎么将生成的那些文件夹以及setup.exe和.msi 文件打包成一个exe 我们这里使用的是Winra ...

  6. NEFU 628 Garden visiting (数论)

    Garden visiting Problem:628  Time Limit:1000ms  Memory Limit:65536K Description There is a very big ...

  7. HDU1244：Max Sum Plus Plus Plus

    题目链接:Max Sum Plus Plus Plus 题意:在n个数中取m段数使得这m段数之和最大,段与段之间不能重叠 分析:见代码 //dp[i][j]表示前i个数取了j段的最大值 //状态转移: ...

  8. 洛谷P4344 [SHOI2015]脑洞治疗仪（珂朵莉树）

    传送门 看到区间推倒……推平就想到珂朵莉树 挖脑洞直接assign,填坑先数一遍再assign再暴力填,数数的话暴力数 //minamoto #include<iostream> #inc ...

  9. Eclipse 最新版2018-09安装Maven教程

    其实在写这篇教程之前,花了不少时间来学习安装Maven.不是链接打不开,要么就是提供的方法不适合我这个版本,当然了,既然你能看到这篇教程说明我已经找到了正确方法. 打开Eclipse-Help-> ...

  10. Luogu P1541 乌龟棋 【线性dp】

    题目背景 小明过生日的时候,爸爸送给他一副乌龟棋当作礼物. 题目描述 乌龟棋的棋盘是一行 N 个格子,每个格子上一个分数(非负整数).棋盘第1格是唯一的起点,第 N 格是终点,游戏要求玩家控制一个乌龟 ...