创建基于AJAX技术的Scribble应用程序

简介

ASP.NET Atlas是一套丰富的类库,用于ASP.NET开发AJAX风格的应用程序。本文试图解说Atlas框架的一般性特征,由于Atlas是一个庞大的库,故本文集中探讨Atlas的两个最重要的特征:

1. 能够从客户端脚本中调用服务器端web服务

2. 使得开发跨浏览器兼容的JavaScript代码相当容易

通过对这两个特征的介绍,读者朋友可以熟悉Atlas类库的使用方法。

背景

MFC Scribble应用程序是学习MFC编程的著名例子之一。Scribble应用程序允许用户使用鼠标自由涂画。我在网络中曾看见这样一个类似的利用AJAX技术的应用程序。但遗憾的是,这个JavaScript绘图站点仅能在Firefox浏览器上运行。因此,我在本文中将解释怎样构建一个跨浏览器版本的Scribble程序。

安装Atlas

在本文完成时,可以点按这个链接下载Atlas的十二月CTP。如果这个链接不能工作,你总可以转到Atlas站点得到正确的链接。该Atlas库可以作为Visual Studio 2005的一个模板(VSI)。在刚才的这个下载站点上有关于怎样安装这个模板的说明。

创建一个Atlas工程

一旦安装了Atlas模板,你就可以通过点按菜单选项"File->New->Web Site"来创建一个空白的Atlas工程。然后就可以打开图1所示的"New Web Site"对话框。

在"location"下面,可以选择"File System"或"HTTP"。选择HTTP将允许你基于一个IIS服务器的站点,而选择File System将允许你在本地文件系统(你可以使用开发web服务器来进行调试和测试)上创建一站点。你可以选择任何一个选项,但是我发现该应用程序如果使用Internet Explorer且基于IIS运行效果更好一些。

Atlas空工程

上面最新创建的Atlas网站具有下列目录结构:

· App_Data

这是放置数据文件的空目录。

· Bin

这个目录下放置相应于装配集Microsoft.Web.Atlas的dll文件。这个目录下包含了Atlas库的服务器位置。

· ScriptLibrary

在这个目录下,你可以放置该应用程序的任何JavaScript文件。

o Atlas

Atlas客户端脚本放在这里,它有如下两个子目录:

§ Debug

Atlas客户端JavaScript文件的调试版本放在这个目录下。

§ Release

Atlas客户端JavaScript文件发行版本放在这个目录下。这个目录下的脚本更为紧凑,并且去除了一些调试代码。

Atlas客户端脚本

Atlas的12月份发行版本提供了下面几个客户端脚本:

· Atlas.js

这是核心Atlas脚本文件,它包括了基本的工具函数和客户端控件和组件。

· AtlasCompat.js

这个文件包含Atlas兼容层以支持Mozilla Firefox和Apple的iMac-Safari web浏览器。这个脚本可以确保Atlas代码是跨浏览器兼容的。

· AtlasCompat2.js

这个文件包含其它函数以确保与Safari web浏览器的兼容性。

· AtlasRuntime.js

这是一个核心Atlas脚本文件的缩微版本,其中并不含有客户端组件和控件。这个脚本文件在前面提到的组件或控件没有使用时使用。

· AtlasUIDragDrop.js

包含工具函数,用于提供网页中的鼠标拖放功能。

· AtlasUIGlitz.js

包含工具函数,用于提供网页中的动画和其它特殊效果。

· AtlasUIMap.js

支持使用Virtual Earth的Atlas映射框架的脚本文件。

时间: 2024-09-17 22:38:21

创建基于AJAX技术的Scribble应用程序的相关文章

使用WebSphere Application Server Feature Pack for Web 2.0创建基于Ajax的

使用WebSphere Application Server Feature Pack for Web 2.0创建基于Ajax的动态Web应用程序 简介 与 Web 2.0 相关的技术,比如 Asynchronous JavaScript XML (Ajax).Web 远程和 Web 消息传递等,在当今的 Web 应用程序中变得日益流行.与传统 Web 应用程序相比,基于 Ajax 的应用程序 可以提供更好的响应性和交互性.在那些并入了 Ajax 架构的 Web 应用程序中 ,用户不需要等待整个

基于Ajax技术实现考试倒计时并自动提交试卷_AJAX相关

1.概述 在开发网络考试系统时,考试计时并自动提交试卷是必不可少的功能.由于在答卷过程中,试卷不能刷新,所以需要使用Ajax实现无刷新操作.运行本实例,访问准备考试页面index.jsp,在该页面中,单击"开始考试"按钮,将打开新窗口显示开始考试的页面,如图10.1所示,页面会自动计时,当考试时间结束时,将自动提价试卷. 2.技术要点 主要是利用Ajax异步提交技术和Servlet技术实现的.显示在考试页面中的计时时间是在Servlet中设置的,需要通过Ajax的异步提交不断的请求Se

基于Ajax技术实现文件上传带进度条_AJAX相关

1.概述 在实际的Web应该开发或网站开发过程中,经常需要实现文件上传的功能.在文件上传过程中,经常需要用户进行长时间的等待,为了让用户及时了解上传进度,可以在上传文件的同时,显示文件的上传进度条.运行本实例,如图1所示,访问文件上传页面,单击"浏览"按钮选择要上传的文件,注意文件不能超过50MB,否则系统将给出错误提示.选择完要上传的文件后,单击"提交"按钮,将会上传文件并显示上传进度. 2.技术要点 主要是应用开源的Common-FileUpload组件来实现分

基于Ajax技术实现文件上传带进度条

1.概述 在实际的Web应该开发或网站开发过程中,经常需要实现文件上传的功能.在文件上传过程中,经常需要用户进行长时间的等待,为了让用户及时了解上传进度,可以在上传文件的同时,显示文件的上传进度条.运行本实例,如图1所示,访问文件上传页面,单击"浏览"按钮选择要上传的文件,注意文件不能超过50MB,否则系统将给出错误提示.选择完要上传的文件后,单击"提交"按钮,将会上传文件并显示上传进度. 2.技术要点 主要是应用开源的Common-FileUpload组件来实现分

zigbee 温度-基于Zigbee技术 DS18B20芯片的程序

问题描述 基于Zigbee技术 DS18B20芯片的程序 基于上述芯片,读取芯片内温度传感器的数值,将外部温度和内部温度显示出来 或者是选一个外接传感器(温度.震动等),将传感器数值通过串口显示在电脑屏幕上 解决方案 网上有好多的啊,你可以自己去百度的

基于Ajax技术实现无刷新用户登录功能

代码如下: // JScript 文件 function usersLogon() { var userName = document.getElementById("txtuserName").value; var password = document.getElementById("txtpassword").value; var checkCode = document.getElementById("txtCheckCode").val

用Asp.Net创建基于Ajax的聊天室程序

如要下载源代码,请到原文地址: http://www.codeproject.com/Ajax/UChat.asp 简介 我的第一个chat room 是用ASP 3.0写的. 程序比较简单,两个text box, 用来处理页面上每秒刷新的信息.那时候,要想建一个真正的chat room,要用 到Java Applet 或者 ActiveX control.基于HTTP的chart rooms都面临着一些 跟我第一个chat room一样的问题.这些问题包括页面刷新导致的屏幕闪烁现象 .但这个问

基于AJAX技术实现Struts校验框架

ajax 提要 实时的数据校验是AJAX技术的重要优点之一,Struts校验框架通过加入这种技术进一步丰富了其MVC,从而使得Web应用程序的开发效果更接近于桌面应用程序. 一. 引言 校验框架的根本目的是实现域校验.在Web应用程序中有许多方法可以实现域校验,总体上可以分为两类:服务器端和客户端.其中,Struts校验框架是适合于基于Java的Web应用程序环境最好的框架之一.它可以使用服务器端校验来配置应用程序并且使用在校验过程(在请求处理期间激活)中生成的错误消息:而且它也可以通过在请求页

如何使用Ajax技术开发Web应用程序(2)

ajax|web|程序 在上一篇文章中,我们讨论了如何通过javascript从一个远程XML文件中取得数据.在这篇文章中,我们将学会怎样对数据作更复杂的处理.作为一个示例,我们会准备一组XML数据,将数据分割成独立的片断并以不同的方式展示这些片断(取决于它们是如何被标识的). 这篇文章是建立在上一篇文章中构造的示例代码的基础之上,所以如果你不能理解我们现在的代码,你可以回过头去读第一篇文章(sheneyan注:就在上面). 开始- 让我们开始我们的第一步:构造XML.我们准备写一个XML文档,