Dreamweaver CS3集成了AJAX框架Spry,使得我最近(jìn)对Spry感上了兴趣。
再次说明下(xià) Spry是Adobe公(gōng)司推(tuī)出的(de)AJAX框架 ,所(suǒ)谓AJAX框架,就(jiù)先谈目前流行的Web2.0。
1,这些Web2.0站点从页面形式上来看,页面(miàn)与浏览(lǎn)者的交互很时(shí)尚(shàng)、也很(hěn)人性化。比如注册信息时输入邮箱(xiāng)不规则(zé),页面立即提示……当然(rán)这在Web2.0之前已有应用,但是从来没有哪个时(shí)候(hòu)像(xiàng)现在如此推(tuī)崇此(cǐ)类即时检测等很(hěn)符合(hé)用户体验的(de)技术(shù),这些脱离不了Javascript脚本(běn)的编(biān)写,其已属(shǔ)于AJAX的定义范畴。
2,当然AJAX不仅仅是这(zhè)些,比(bǐ)如要(yào)做个(gè)“TabPane 选项卡”很炫酷的页面展示功能,我(wǒ)们手写Javascript脚本就比较的费事,当然还有很多的在Web2.0站点(diǎn)看到的比如“显示和隐藏”、“淡入淡出”等特效,这(zhè)些都离不(bú)开Javascript,而现(xiàn)在我们也称为(wéi)AJAX技术。
3,AJAX最核心的技术就是数据处理的能力,并能进(jìn)行远程异步处理的能力,主要集中(zhōng)在对XML数据的数据(jù)交互上。
所有这(zhè)些,Javascript占最大比重(chóng),XHTML、CSS作(zuò)为表(biǎo)现形式而存在、因XML涉(shè)及的XSLT、XPATH等技术融入其中,还有相关(guān)的DOM操(cāo)作(zuò),这(zhè)些所有有(yǒu)需要功能文件的(de)组合体(tǐ)就构成了(le)AJAX框架(如(rú)果可(kě)以,你(nǐ)也可以自(zì)己写(xiě)一个AJAX框架给大家使(shǐ)用)。
Adobe Spry 介绍(shào)页有这样一(yī)句(jù)话:
With Spry, you can use HTML code, CSS code, and a minimal amount of JavaScript to incorporate XML data into your HTML documents, create widgets such as accordions and menu bars, and add different kinds of effects to various page elements.
使用Spry框架(jià),用(yòng)HTML、CSS、JavaScript就(jiù)可以(yǐ)在HTML文(wén)章中展现XML数据、建立(lì)诸(zhū)如炫酷菜单的一(yī)些界面,还(hái)有其他(tā)的一些页面特效(大(dà)体(tǐ)上分了三类(lèi)内容,这也是Spry AJAX框架所具备的)。
由此(cǐ),学习Spry就(jiù)可以从如下三点开始:
Working with Spry widgets
Working with Spry Effects
Working with Spry XML Data Sets
前天关于 Dreamweaver CS3集成Spry效(xiào)果试用(yòng) 就(jiù)是Spry widgets中的一例,今天介绍的表单检测还属其中内容。
在页面中插(chā)入“Spry”-“Spry validation text field”文(wén)本框(kuàng)之后,在选中该表单元素之(zhī)后除了显示其(qí)元素属性以外,在(zài)选择(zé)该(gāi)表单元素之上的蓝(lán)色文本(běn)“Spry TextField”,属性面(miàn)板中显示了表单验证相关的选项内(nèi)容(róng)。
比如下图就是选择“Type”是“Email Address”的邮件输入检测,触发的(de)动作默认是(shì)“Submit”,当然自己也可以选(xuǎn)择(zé)“Blur”或(huò)“Change”,对(duì)于这些操作,则要求使用者具备简单(dān)的Javascript知识(shí)。还可以设置(zhì)默认文本提示,是否必须填写等。
测(cè)试地址: http://www.dw8.cn/demo/spry/spry_form.html
这些操作,对于(yú)有(yǒu)Dreamweaver经(jīng)验的用(yòng)户(hù)来说(shuō),曾(céng)经是在DW的脚本行为中的操作(zuò),不(bú)过那些(xiē)显示(shì)的是弹出警告框,而现在是紧随表单元素之后的(de)即时显示的文字信息(xī),相(xiàng)比较一下哪个更(gèng)让用户觉(jiào)得亲切呢(ne)?——这就是(shì)Web2.0在表现形(xíng)式上质(zhì)的飞跃。
利用(yòng)Spry框架提供这些操作(zuò)不仅生成(chéng)基于标准(zhǔn)的XHTML+CSS代码(mǎ),还能(néng)完(wán)成完善用户体验的页面(miàn)功能,这是在Dreamweaver cs3初试Spry的体会。
下面(miàn)再试用(yòng)下Spry框架的(de)Effects和XML Data,相信(xìn)更精(jīng)彩。 |