不使用Ajax框架实现Ajax效果?

为了简单明了,我只在html中测试;注释里写的很清楚,我就不多废话了;

很多家公司在面试的时候可能会让你不使用任何Ajax的框架实现Ajax效果,虽然这段代码看上去挺痛苦,但也没有别的办法,记不记也得记(其实理解起来就没那么难记了……)

readyState表示XMLHttpRequest对象的处理状态:
0:XMLHttpRequest对象还没有完成初始化。
1:XMLHttpRequest对象开始发送请求。
2:XMLHttpRequest对象的请求发送完成。
3:XMLHttpRequest对象开始读取服务器的响应。
4:XMLHttpRequest对象读取服务器响应结束。

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>不使用Ajax框架实现Ajax效果 </title>
    <script type="text/javascript" language="javascript">
        function btnClick() {
            var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHTTP对象,相当于WebClient
            if (!xmlhttp) {
                alert("创建xmlhttp对象异常!");
                return false;
            }

            xmlhttp.open("POST", "GetDate.ashx", false); //准备向服务器的GetDate.ashx(一般处理程序)发出POST请求。
            //XMLHTTP默认(也推荐)不是同步请求的,也就是open方法并不像WebClient的DownloadString那样把服务器返回的数据拿到才返回,是异步的,因此需要用匿名监听onreadystatechange事件;
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4) {    //如果XMLHTTPRequest对象读取服务器响应结束;
                    if (xmlhttp.status == 200) {  //如果状态码为200则表示处理成功;

                        document.getElementById("GetDate").value = xmlhttp.responseText;  //responseText属性为服务器返回的文本
                    } else {
                        alert("AJAX服务器返回错误");
                    }
                }
            }
            xmlhttp.send(); //这时才开始发送请求
        }
    </script>
</head>
<body>
    <input id="GetDate" type="text" />
    <input type="button" value="请求时间" onclick="btnClick()" />
</body>
</html>

 

GetDate.ashx (一般处理程序)代码:

 

using System;
using System.Web;

namespace AJAX
{
    /// <summary>
    /// GetDate 获取服务器的时间
    /// </summary>
    public class GetDate : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Write(DateTime.Now.ToString());
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

 

时间: 2024-10-13 15:44:00

不使用Ajax框架实现Ajax效果?的相关文章

AJAX框架&amp;简介

ajax|ajax框架 Ajax,使用它可以构建更为动态和响应更灵敏的Web应用程序.该方法的关键在于对浏览器端的JavaScript.DHTML和与服务器异步通信的组合.本文也演示了启用这种方法是多么简单:利用一个Ajax框架(指DWR)构造一个应用程序,它直接从浏览器与后端服务进行通信.如果使用得当,这种强大的力量可以使应用程序更加自然和响应灵敏,从而提升用户的浏览体验. 该应用程序中所使用的示例代码已打包为单独的WAR文件,可供下载. 简介 术语Ajax用来描述一组技术,它使浏览器可以为用

创新源于理解 轻松打造自己的AJAX框架(1)

ajax|ajax框架 作者:陈振泉出处:天极开发责任编辑: 方舟 [ 2006-03-16 15:01 ] 本文实现的只是一个最基本的AJAX框架.虽然AJAX并不是什么新技术,但是做为一个框架并不是一篇文章就能说明白的 本文实现的只是一个最基本的AJAX框架,虽然AJAX并不是什么新技术,但是做为一个框架并不是一篇文章就能说明白的.写这篇文章的目的:希望能帮助初学者更好的学习.运用AJAX框架. 我始终相信只有你真正理解了一种技术,了解了技术本身,你才能更好.更灵活的使用它.一个程序员对技术

AJAX框架JSON-RPC-Java 1.0rc2 发布

ajax|ajax框架|js AJAX框架JSON-RPC-Java 近日宣布JSON-RPC-Java 1.0rc2 发布. JSON-RPC-Java 是一个用Java来实现动态JSON-RPC 的框架.利用它内置的一个轻级量JSON-RPC JavaScripIt客户端,可以让你透明地在JavaScript中调用Java代码.JSON-RPC-Java可运行在Servlet容器中,因此可以在一个基于JavaScript 与DHTML 的Web应用程序中利用它来直接调用普通Java方法与EJ

jquery框架是$.ajax()的使用方法简单说明

ajax() 方法通过 HTTP 请求加载远程数据. 该方法是 jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性. 最简单的情况下,$.ajax() 可以不带任何参数直接使用. 注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置 实例  代码如下 复制代码 $.ajax({ type:'p

20 个精美的Ajax + CSS 的表格效果

20 个功能强大,外观漂亮的基于Ajax + CSS 的表格效果,你可以从这些示例中学习怎么使用这些表格提供的排序和过滤的功能来组织表格中的数据.现在让我们来看看这些表格: #1. TableclothTablecloth 由CSS Globe 开发,是一个轻量级的.易于使用的表格,以友好的方式将样式和行为添加到你当前的HTML 表格元素当中. #2. Ask the CSS Guy TableAsk the CSS Guy Table 演示了怎么样创建一个可以显示数据之间的关系的表格,例如在单

某知名大企业的教训--慎用AJAX框架

ajax|ajax框架 从年初到现在,AJAX之风预演愈烈,尤其是在国内,大多是一片叫好的声音.目前好像很多人都在搞基于AJAX的框架,国外也有一些都已经发布.对于这种一直都存在技术,Google.微软一造势,大家的热度好像有点过了头.看来现在咱们这些程序员真的都是些追星族啊! 难到AJAX真的就那么优秀,值得提升到框架的高度,让系统UI端围着它转?单纯从AJAX本身来说,其最主要不过就是解决在网页上一个无刷新获取数据的问题,再加上减少了数据的传输量,将数据解析的工作推到了客户端,的确能解决很多

php的ajax框架xajax入门与试用

一.xajax与其它ajax框架的比较 xajax功能很简单,但很灵活!~它不象其它一些大的框架,功能确实强大,但执行速度不敢恭维..功能虽多,但不够灵活.api多,学起来简直如同学习一门新的语言. 二.xajax功能介绍 xajax的功能比较简单,但就因为简单,所以灵活.同时,这也要求使用者要对javascrīpt / vbs 客户端脚本有一定的了解.因为它的功能是比较活的.可以说单纯使用xajax,什么也做不出,但配合js / vbs 又什么都做的出. xajax主要是使用xajaxResp

一个更好用更高效的Ajax框架XCallback

今天特意和大家分享一个自认为很不错的ajax的框架XCallback,它是对callback的扩展 ,笔者曾经用过好几款ajax框架,最早用UpdatePanel 后来处于性能的考虑决定废弃,废弃原因有4: 1.网页首次要加载310kb的axd文件,占网速也占用浏览器的载入时间. 2.效率很低,违背了ajax的初衷,回传了viewstate和所有控件的值3.不够灵活,面对复杂而多变的项目开发,不是用几个拖拽就能解决问题,编程仍然是解决问题的核心,但是你想在他强加的思想下做出改变又是何等困难 .

推荐使用轻量级ajax框架-jQuery

小而强大是我们在系统开发的时候所追求的,用少量代码解决复杂问题这是优秀代码的灵魂: 而我们平常使用的架构.框架正是这种思想的实例化: 术语:RIA(RIA是Rich Internet Applications的缩写,翻译成中文为富因特网应用程序)技术 随着浏览器厂商对产品的标准化和Web2.0技术的成熟程度我们会经常在开发中使用AJAX这种看似简单但功能强大的技术,关于AJAX技术的介绍在此省略大家可以到网上查找相关 资料:在使用AJAX开发的过程中重点还是怎么提交表单.根据数据操作DOM,随后