zoukankan      html  css  js  c++  java
  • 跟着jquery API学jquery之八 ajax

    看到ajax这里我们先看一下如何用javascritp写一个ajax出来

    Ajax的原理就是XMLHttpRequest这个对象

    首先我们需要建立这个对象

    首先我们建立一个xajax.js的文件

    1 var request = false;
    2
    3  try {
    4
    5 request = new XMLHttpRequest();
    6
    7 } catch (ex){
    8
    9 try {
    10
    11 request = new ActiveXObject("Msxml2.XMLHTTP");
    12
    13 } catch(ex1){
    14
    15 try {
    16
    17 request = new ActiveXObject("Microsoft.XMLHTTP");
    18
    19 } catch (failed) {
    20
    21 request = false;
    22
    23 }
    24
    25 }
    26
    27 }
    28
    29  

    这里我们建立了一个XMLHttpRequest对象 ,XMLHttpRequest对象唯一的目的就是发送请求和接受相应

    我们在ajax中常用的几个函数

    open():建立到服务器的新请求。

    send():向服务器发送请求。

    abort():退出当前请求。

    readyState:提供当前 HTML 的就绪状态。

    responseText:服务器返回的请求响应文本。

     

    1 function GetInfo(url) {
    2
    3 request.open("GET", url, true); //open函数中设置为true是异步的关键
    4  
    5 request.onreadystatechange = callback;//设置一个回调函数
    6  
    7 request.send(null); //send用来传递参数 如果没有则为null
    8  
    9 }
    10
    11
    12
    13  //现在我们实现这个回调函数
    14  
    15  function callback() {
    16
    17 //首先我们判断一下状态
    18  
    19 if (request.readyState == 4) { //4表示响应完成
    20  
    21 if (request.status == 200) { //200表示合同谈判状态是顺利的 比如我们会见到404的的错误
    22  
    23 //判断完成后我们就可以对服务器返回的值做处理了
    24  
    25 $("#a").text(request.responseText);
    26
    27
    28
    29 }
    30
    31 }
    32
    33 }
    34
    35

    这样我们就基本完成了一个最基本的ajax,然后我们建立一个hand.ashx的处理程序

    我们在index.aspx页面上放置一个按钮 ,并写上onclick="GetInfo('hand.ashx')" ,这样就完成了一个简单的ajax

    当jquery出现之后 ,ajax就变成了一句话的事情 

    要实现上面的请求 jQuery要怎么做呢

    我们看一下load这个函数:载入远程的html文件代码,并插入到DOM中,

    那么我们只需要

    $('#a').load('hand.ashx')

    就可以实现上面我们写的N多代码

    当然,我们知道有两中方式 get和post,jquery中提供了

    $.get(url,[data],[callback],type)  $.post()两种方式,分别用简单的get/post来取代复杂的$.ajax

    其中 url表示地址 data为传入参数 callback为回调函数 type为返回值的类型

    当然,有时候这种方式也无法满足我们的需求 这里就要用到$.ajax了

    在这个函数中可以很方便色设置ajax的细节 如:

    $.ajax({
    type:
    "get",
    url:
    "hand.ashx ",
    success:
    function(text){
    alert( text);
    }
    });
    当然我们并不希望每次写$ajax都要重复的写这些细节,这时我们就要用到
    $ajaxSetup了 ,用来设置全局的ajax默认选项,参数方式与$.ajax一样
     到这里ajax就差不多了,但是有时候我们需要对ajax执行的进度操作,比如在请求数据时显示 请稍候  ,在数据请求完成时显示数据之类的。
    这里就要用到ajax事件了
     ajaxSend(callback) ajax请求发送前执行
    ajaxStart(callback) ajax请求开始时执行
    ajaxComplete(callback)  ajax请求完成时执行
    jQueryajaxStop(callback)  ajax请求结束时执行
    ajaxSuccess(callback)   ajax请求成功时执行
    jQueryajaxError(callback) ajax请求错误时执行
    
    
    相关代码
  • 相关阅读:
    Enterprise Library3.1 使用数据访问模块时,调用Microsoft.Practices.EnterpriseLibrary.Data报出源文件与当前应用程序不一致和创建dataconfiguration的配置节处理程序出错
    net精华:C#中对注册表的操作
    [翻译]使用Enterprise Library 3.0的日志程序块
    分布式应用程序概述
    调整Oracle数据库print_bill表字段BillMKID的顺序,并判断表print_bill是否存在及字段billMKID是否存在
    Win32下注册COM组件后对注册表产生的变动
    vc 字符串与指针
    SQL Server不允许进行远程连接的解决办法
    vc上字符串,CString ,string,char数组&char指针
    如何用Visual C#来创建、修改注册信息
  • 原文地址:https://www.cnblogs.com/ac1985482/p/1708800.html
Copyright © 2011-2022 走看看