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