QUI框架介绍.ppt

  1. 1、本文档共87页,可阅读全部内容。
  2. 2、有哪些信誉好的足球投注网站(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
  3. 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载
  4. 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
举例2:盒子模型(多功能容器) 只需要把div的class设为box2,并添加一些设置宽高和标题文字的属性,如下: div class=box2 panelWidth=300 panelHeight=200 panelTitle=控制面板 内容区域br /内容区域br /内容区域br /内容区域br / /div 就创建了一个多功能容器。效果如下: 该容器可自定义宽高、自定义标题、可设置是否出现右上角文字并可自定义该文字内容和功能。默认功能是收缩和展开。 举例3:警告框 只需要将普通的alert(xxx)前面加上 top.Dialog,如下: top.Dialog.alert(这里是提示信息); 就改造成了一个友好的警告框。效果如下: 确认框和弹出窗口的使用同样也很方便。 举例4:弹出式提示框 写如下代码: $.messager.show(0,提示内容!,10000,message.mp3); 就创建了一个弹出式提示框。效果如下: 4个参数分别用来设置:标题、内容、弹出后停留时间、弹出时播放的声音文件 举例5:文本框 为普通的文本框标签添加watermark=“xxx”则有水印功能: input type=text watermark=输入查询条件/ 设置文本框的clearable属性为true,就会在输入时出现一个小叉子,用于清空: input type=text clearable=true/ 对文本框设置maxNum属性可以限制文本框的最大输入字数,并在输入时出现提示: input type=text maxNum=10/ 对密码框设置checkStrength=true会检查密码强度: input type=password checkStrength=true/ 举例6:单选下拉框 渲染的下拉框的写法和用法与原始的select完全一样。如 selectoption value=1新增图片/optionoption value=2维护图片/option/select 当为select标签添加editable=“true”时就变成可编辑的下拉框 添加colNum=“xx”就可以自定义下拉框的列数 添加childDataPath设置数据来源并添加childId指定想要联动的下拉框就创建了联动下拉框 举例7:日期控件 为普通文本框添加class=“date” ,如下: input type=text class=date/ 就变成一个日期控件。效果如右侧所示: 再添加dateFmt属性可以设置日期控件的现实方式 ,例如: input type=text class=date dateFmt=HH:mm:ss/ 就可以只显示时间,效果如右侧所示: 举例8:表单验证 对需要验证的表单元素加上class=“validate[XXX]”,其中XXX是验证规则,例如required表示必填项,length[0,20]限制字符长度在20字以内。验证规则可写多个。代码如下: input type=text class=validate[required,custom[chinese],length[0,20]]/ 则该文本框属于必填项,只能输入中文,不超过20个字符。若填写不符合规则,效果如下: 框架中自带了10多种验证规则,另外还可以通过正则表达式自定义验证规则。 亮点8:非常丰富的皮肤样式 十大亮点 在前面以天蓝色风格为例展示了框架的10几种不同结构的主页和内容模板以及各种组件。除了天蓝色风格外,框架本身还自带了10多套不同风格样式的皮肤。 只需要更改主页的两个参数值即可实现切换成另一种风格(支持动态换肤) 。 同时也支持用户自己设计皮肤。 12种不同结构的主页中每种结构都有8-10套皮肤 切换成亮蓝色风格 切换成橙色风格 组件自动换肤 当更改主页参数进行换肤后,系统的所有内页与组件都会自动获取主页的配置来更换风格。无需对每个内页再做配置。例如更换了橙红色的风格,则组件风格变成如下效果: 多达140套精心设计制作的登录页面皮肤 登录页风格之一 登录页风格之二 亮点9:完美的浏览器兼容性 十大亮点 框架在整个制作过程,通过多种兼容性技术一直确保在各主流浏览器中做到兼容。 目前可以与以下主流浏览器完美兼容: 兼容性 windows中: IE6、IE7、IE8、IE9、FireFox、Chrome、Safira Linux中: FireFox 亮点10:提供组件与特效的分离版本 十大亮点 如果你的WEB应用只需要使用框架的某几个组件或特效,那么不必将整套框架机制全部引入到项目中,QUI框架还提供的组件与特效的分离版本。 分离版本将QUI框架集成的100多种组件和特效进行分离,每种组件或特效独立为一个目录。使用时只要找到

文档评论(0)

junjun37473 + 关注
实名认证
内容提供者

该用户很懒,什么也没介绍

1亿VIP精品文档

相关文档