Springside - 3.3.2 - 技术参考手册(9)

2020-02-21 15:32

^/common/user/([0-9]+)\\.htm$

1. 资料

JQuery资料(江南白衣博物馆) ? Dojo Base ? 2. 选型

因为widgets框架如Ext 和 Dojo Dijit始终不够好用,决定还是忍一忍,等一等到RIA时代。

? Prototype.js,JQuery, Dojo Base这类Javascript库,有助于跨浏览器的 Javascript,并简化对象选择、DOM操作、Ajax操作。 ? JQuery比Prototype.js的发展似乎好一点,起码Plugin是在官方网站管理的,同时JQuery UI也在向着好的方向发展。

? 如果自己写的JavaScript很多,则推荐用Dojo,因为它的javascript文件Package管理和Javascript最弱的 面向对象继承机制

是做的最好的。

?

3. JQuery in SpringSide3

在Showcase的Ajax示例中演示了jquery的ajax标准功能和基于JSONP的跨域访问。

3.1 基本功能

JQuery的最基本功能包括是选择DOM对象,设置其内容、属性、CSS及一些常用操作,如: $(\

其中#loginName 是CSS语法,获得页面id为loginName的元素。一般按ID获取对象已足够,想使用更高级的CSS+XPath的获取方法,参考JQuery的Selector文档。

注意JQuery1.3后,按属性查询对象的语法已取消@,下面语句为name为\的radio,checked值为\的 box。 $('input:radio[name=gender]').val(['male']);

3.2 Ajax

在showcase使用了ajax的几种常用法,包括: 1. 将Form中的内容序列化成字符串动态提交。 2. 动态获取文本内容,更新本页内容。 3. 动态获取JSON内容,更新本页内容。

4. 基于JSONP,跨域获取html内容,更新本页内容。

注意要避免缓存,要不服务端返回时输出no-cache参数,要不使用JQuery中最麻烦的用法$.ajax()方法来设定非缓存参数,详见JQuery官方文档。 因为Ajax时,会在URL中传输中文字符,需要设置URI-Encoding=\如Tomcat在server.xml中设置),否则会 出现乱码。 跨域访问的细节可见IBM DW的文章《Cross-domain communications with JSONP》

3.3 Valiation plugin

Validation 是著名的客户端输入校验plugin,可进行非空、数字等常规校验,也可以远程ajax判断用户名是否唯一,详见 JQuery Plugin资料。

min-web中用它代替了Struts2的validate框架,详见的user-input.jsp(正式风格)、login.jsp(轻量风格)。

4. DOJO Base in SpringSide3

在showcase的Ajax示例中演示了DOJO Base的面向对象和Package管理。

Dojo Base的基本功能没什么出彩的地方,不过不失,但它的面向对象继承与JavaScript Package管理就做得很不错,如果项目需要写大量的Javascript,可采用Dojo Base来加强管理。

4.1 面向对象定义

下面这段容易理解的面向对象父类子类定义,在JavaScript世界是很难得的。 //父对象, 拥有_color属性与getColor()函数 dojo.declare(\ _color : \ constructor : function(color) { this._color = color; }, getColor : function() { return this._color;

} });

//子对象, 拥有半径属性与计算范围的函数, 同时继承父对象属性与函数. dojo.declare(\ _radius : 0, constructor : function(color, radius) { this._radius = radius; }, getArea : function() { return Math.PI * this._radius * this._radius; }, generateContent : function() { return \ } });

4.2 Package管理

在dojo js文件的父目录,放入需要管理的目录与原文件,如dojo.js路径为js/dojo/dojo.js, 放入新的js/showcase/shape.js,并在shape.js中声明dojo.provide(\ 则可在任意地方以以下语句载入该文件。 dojo.require(\

1. 参考资料

? 使用YUI CSS 2. 选型

互联网发展飞快,转眼间CSS也需要Framework来保证页面在各种浏览器上表现一致,支持缩放了, 连px像数点都不是定义布局时的最佳单位了。

在YUI CSS 与Buleprint之间,貌似Blueprint的宽度总是比较固定,如950px,所以基本CSS框架选了YUI CSS.

3. In SpringSide3

SpringSide3将YUI CSS2.8 r4的四个文件全压在了yui.css中,分别是:

reset.css:消除各种浏览器之间对HTML元素样式表现的差异,从而提供一致的样式

? base.css:使用Reset消除了浏览器默认样式,使用Base就可以使HTML元素在A级浏览器中获得一致的表现 ? font.css:提供跨浏览器的字体样式和控制。默认大小是13px,其他px的百分比见图表 ? grid.css:提供布局。

?

SpringSide3中的布局很简单, id=\声明了一个100%的页面, class=\声明了bd div左边栏180宽。id=\声明了这是主栏。id=\的意义也很明显,其他剩下的就是有时多得有点让人烦的 yui-b了。


Springside - 3.3.2 - 技术参考手册(9).doc 将本文的Word文档下载到电脑 下载失败或者文档不完整,请联系客服人员解决!

下一篇:1、浅谈加强房地产开发企业财务预算管理

相关阅读
本类排行
× 注册会员免费下载(下载后可以自由复制和排版)

马上注册会员

注:下载文档有可能“只有目录或者内容不全”等情况,请下载之前注意辨别,如果您已付费且无法下载或内容有问题,请联系我们协助你处理。
微信: QQ: