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