多语言展示
当前在线:958今日阅读:91今日分享:37

系统项目中添加页面向导的详细解析

页面向导,简单来说,就是给初用系统的用户详细介绍该系统用法的功能性页面,下面我就介绍下怎么在项目加入页面向导。
工具/原料
1

Myeclipse编译软件。

2

dreamweaver等页面编译软件。

3

电脑

方法/步骤
1

在dreamweaver中建立一个guide.jsp页面,简称为:“向导页面”,设计好向导页面的CSS样式,图片格式,页面应用的脚本等。

2

a)添加guide(向导页面相关CSS,图片,脚本文件等)文件夹到web目录下b)添加guide.jsp(向导页面)到jsp/common目录下  (请根据自己项目的要求定义页面和样式内容存放地址。)

4

在需要添加想到的页面下方之后之前添加静态引用引用guide.jsp静态引用,如:<%@ include file='/jsp/common/guide.jsp'%>

5

设置用到的步骤及元素。步骤使用id作为定位,设置每一步骤的元素id唯一,现当前步骤样式为文字变红,如需修改可修改guide.jsp页面代码,ext.toolbar上的按钮请在text的之中使用标记以方便更改文本颜色。如:{    text: '查询',    icon:'<%=contextPath%>/images/query.gif',    handler:search}

6

保存并重新加载页面,查看控制台打印的当前页面URI路径,在数据库的tab_guide表添加一条记录,主键唯一,并把刚才看到URI路径放入该表的url字段中。表中个字段的含义键字段注释;在tab_guide_config表配置向导步骤,步骤顺序由orderid的顺序决定(值从小到大排序),guideid为对应的tab_guide表的相应记录的主键,个字段的含义键表的字段注释。

7

调用方法,在ext.toolbar中添加按钮调用,具体代码为:{    text: '开始向导',    icon:'<%=contextPath%>/' + 'images/bzd.gif',    handler:guidenow}

8

如果需要默认每次加载页面后都需要调用向导则可以在调用页面的最底部添加代码:

推荐信息