zoukankan      html  css  js  c++  java
  • Ajax技术简单入门

    随着Google公司推出的Gmail服务后,越来越多的人开始关注Ajax技术了,所谓Ajax(Asynchronous JavaScript and XML缩写)技术,就是指运用JavaScript和XML在不用刷新Web页的情况下与Web服务器通信的技术.
    一般来说,使用Ajax技术主要有两个原因:一是fast;二是cool。
    下面通过一个示例来说明Ajax的使用:
    1.HTML代码
    btn1用来调用Ajax代码(请求服务器并将返回信息填充到select1里)。

    1 <select id="select1">select>
    2 <input id="btn1" value="Fill Select" type="button" onclick="getOptions();">

    2.JavaScript代码调用Ajax

     1// Create the Request object (the AJAX wrapper)
     2var request = new Request();
     3// Change this to fit your environment
     4var url = "http://localhost/ajax/";
     5function getOptions()
     6{
     7    // Call the AJAX
     8    // Notice the second parameter is actually a function to handle the response
     9    request.GetNoCache(url + "requests/getOptions.aspx",
    10    function(result)
    11    {
    12        if (result.readyState!=ReadyState.Complete)
    13            return;               
    14        if (result.status==HttpStatus.OK && result.responseText != "")
    15        {
    16            // If the request was successfull and returned data
    17            var vals = result.responseText.split("~");
    18            for (i=0; i<vals.length; i++)
    19            {
    20                var pair = vals[i].split("|");
    21                var op = new Option(pair[1], pair[0], falsefalse);
    22                var sel = document.getElementById("select1");
    23                sel.options[sel.length] = op;
    24            }

    25            alert("Remember that the new values in form" + 
    26                  " element 'select1' are not in viewstate." + 
    27                  " Code appropriately.");
    28        }

    29        else
    30        {
    31            // Handle the failure condition
    32            alert('Get options failed.');
    33        }

    34    }

    35    )
    36}

    3.aspx文件

    1 <%@ Page language="c#" Codebehind="getOptions.aspx.cs" AutoEventWireupo="false" Inherits="ajax.requests.getOptions" %>
    2 <%=result%>

    4.codebehind代码

    1protected string result = string.Empty;
    2private void Page_Load(object sender, System.EventArgs e)
    3{
    4    for (int i=0; i<10; i++)
    5    {
    6        result += i.ToString() + "|option " + i.ToString() + "~";
    7    }
    8    result = result.Substring(0, result.Length - 1); // to drop the last '~'
    9}

    更多Ajax
    下载:源文件 项目测试
  • 相关阅读:
    《大话数据结构》第1章 数据结构绪论 1.2 你数据结构怎么学的?
    伍迷七八月新浪微博集锦
    《大话数据结构》第9章 排序 9.7 堆排序(下)
    《大话数据结构》第3章 线性表 3.8.2 单链表的删除
    《大话数据结构》第9章 排序 9.5 直接插入排序
    《大话数据结构》第9章 排序 9.8 归并排序(上)
    《大话数据结构》第2章 算法基础 2.9 算法的时间复杂度
    《大话数据结构》第1章 数据结构绪论 1.1 开场白
    《大话数据结构》第9章 排序 9.1 开场白
    [AWS] Assign a public IP address to an EC2 instance after launched
  • 原文地址:https://www.cnblogs.com/SOSOS/p/329268.html
Copyright © 2011-2022 走看看