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