-----------------------------------------------------------------------------
主页面index.html

<html>

<header>    #中间加载样式和JS, 静态文件迁移至项目中时要注意路径。

</header>

<body scroll="no">

    <div id="layout">

        <div id="header"> # 页面顶部部分

        </div>

        <div id="leftside">    # 左侧导航栏部分

            <div id="sidebar_s">    # 伸缩按钮

                <div class="collapse">    # collapse则表示所有第一级节点默认为折叠状态

                    <div class="toggleCollapse"><div></div></div>

                </div>

            </div>

            <div id="sidebar">    # 侧菜单部分

                <div class="toggleCollapse"><h2>主菜单</h2> <div>收缩</div> </div>

                <div class="accordion" fillSpace="sidebar">

                    ----------------------------------------------- # 虚线中间为菜单内容，可替为动态数据

                    <div class="accordionHeader">

                        <h2><span>Folder</span>用户</h2>

                    </div>

                    <div class="accordionContent">

                        <ul class="tree treeFolder">    # treeFolder:在所有树节点前加上Icon图标

                            <li>

                                <a href="" target="navTab">用户管理</a>

                                <ul>

                                    <li><a href="./userlist.html" target="navTab" rel="userlist">用户列表</a></li>

                                    <li><a href="./userlist.html" target="navTab" rel="userlist">用户添加</a></li>

                                </ul>

                            </li>

                        </ul>

                    </div>

                    ------------------------------------------------

                </div>

            </div>

        </div>

        <div id="container">    #主体部分，多标签页形式

        </div>

    </div>

    <div id="footer">@author chenwei (www.chenwei.ws) </div> # 页脚部分

</body>

</html>



# 打开所有html文件可以看到，除index.html外，其余均为html代码碎片，它们使用nabTab/dialog形式显示。

-----------------------------------------------------------------------------------

官方对学习DWZ的几点建议：

1.通读DWZ文档。（PS:东西比较碎，大部分有你想知道的）

2.看demo每个组件演示和代码。（PS:代码碎片可以现用）

3.建议安装firebug，用firebug看html结构，CSS和调试JS。（PS:想了解哪块结构就使用firebug）

4.初学者不建议看DWZ全部源码，非常有必要看看dwz.ui.js和dwz.ajax.js

5.可以从google code下载dwz_thinkphp版本，结合php后台去理解DWZ和服务器端的交互方式

深入jUI（DWZ）的更多相关文章

  1. 将j-ui(dwz)套用到thinkphp注意事项

    目前我用的 thinkphp 版本是  3.1.3 J-UI  dwz 版本好像是 1.4 现在 j-ui有 thinkphp的例子了,请尽量以他们原创为主,我这里都是一些自己搜集和自己钻研的土办法, ...

  2. RoadFlow工作流与JUI(DWZ)前端框架的集成

    此文只说明RoadFlow前端与JUI的集成,关于程序和接口请参照WebForm或MVC文档. 修改JUI配置文件dwz.frag.xml,此文件一般位于JUI根目录下. 2.修改文件js/dwz.n ...

  3. JUI/DWZ介绍、简单使用

    简介 由于开发的项目使用JUI,所以学习了. DWZ富客户端框架(jQuery RIAframework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架.(现在更名为JUI) 可 ...

  4. JUI/DWZ 分页 Servlet

    分页介绍 参考:官方用户手册中的"分页组件"         分页思路服务器返回当前页的数据,总条数,再由js来生成分页标签.分页是配合服务器端来处理的, 不是存js做的分页. 因 ...

  5. 【转】推荐10款最热门jQuery UI框架

    推荐10款最热门jQuery UI框架 原创 在进行Web开发时,并非所有的库都适合你的项目,但你仍需要收藏一些Web UI设计相关的库或框架,以在你需要的时候,加快你的开发效率.本文为你推荐10款非 ...

  6. 基于jquery开发的UI框架整理分析

    根据调查得知,现在市场中的UI框架差不多40个左右,不知大家都习惯性的用哪个框架,现在市场中有几款UI框架稍微的成熟一些,也是大家比较喜欢的一种UI框架,那应该是jQuery,有部分UI框架都是根据j ...

  7. javascript开源大全

    javascript开源大全 Ajax框架-jQuery 可视化HTML编辑器-CKEditor 国产jQuery-UI框架-(jUI)-DWZ 网页开发FireFox插件-Firebug 服务器端的 ...

  8. DWZ(JUI) 教程 左侧栏默认是关闭状态的问题

    DWZ(JUI) 教程 左侧栏默认是关闭状态的问题,初始化是全屏状态,只需简单处理就可以了 $(function(){ DWZ.init("dwz.frag.xml", { log ...

  9. DWZ (JUI) 教程 tree 控件的选中事件

    DWZ (JUI) 教程 tree 控件的选中事件 先简单说一下流程 第一步 当然是先定义好回调事件了 function checkCallback(json){ ........... ...... ...

  10. Dwz(J-UI)框架--入门

    http://www.cnblogs.com/chenyongsai/p/4933982.html Dwz(J-UI)框架--入门 一.了解 概述:是中国人自己开发的基于jQuery实现的Ajax R ...

随机推荐

  1. Linux下安装与卸载anaconda

    安装:到安装文件夹的目录下输入 bash Anaconda3-4.1.1-Linux-x86_64.sh 卸载:输入

  2. plugin 看不到update按钮

    然后再按一下tab键,焦点就会在 update上了.然后再回车.

  3. 第11章 拾遗5：IPv6和IPv4共存技术（3）_NAT-PT技术【全书完】

    6.4 NAT-PT (1)NAT-PT和NAT的差别 ①NAT-PT(附带协议转换的网络地址转换)技术秉承NAT技术的思想,但在原理方面大有不同. ②NAT-PT和NAT本质的区别在于应用场合的不同 ...

  4. openstack cpu pinning

    为了减少CPU竞争,提高CPU cache命中率,可以把guest的vcpu pin到host的物理CPU上. 在openstack中,可以添加以下到flavor extra specs: hw:cp ...

  5. fatal error C1083: Cannot open include file: 'openssl/opensslv.h'

    在安装针对ELK系统的警告工具elastalert时,报错: fatal error C1083: Cannot open include file: 'openssl/opensslv.h',如下图 ...

  6. Java方法通过RestTemplate调用restful接口

    背景:项目A需要在代码内部调用项目B的一个restful接口,该接口是POST方式,header中 Authorization为自定义内容,主要传输的内容封装在body中,所以使用到了RestTemp ...

  7. 零基础学习python_魔法方法（41-48课）(迭代器)

    接下来这个为啥要叫魔法方法呢,额,这个嘛我是跟小甲鱼的视频取的名字一样的,因为会讲比较多杂的东西,有... 魔法方法详细阅读地址:http://bbs.fishc.com/thread-48793-1 ...

  8. 接口详解例子代码（附Java1.8的接口新特性）

    接口,与抽象类类似但是区别也很大,他们都是标签,用来提醒父类一定要实现的类里创建抽象方法.而接口类可以implements 多个接口,抽象类则只能父类只能继承一个抽象类,与抽象不同的是它不是继承组合关 ...

  9. 使用tpcc-mysql进行性能测试

    tpcc-mysql的github地址:https://github.com/Percona-Lab/tpcc-mysql tpcc-mysql源代码进行编译,服务器上需要安装有mysql git c ...

  10. Java课程作业之动手动脑（四）

    1.继承条件下的构造方法调用 class Grandparent { public Grandparent() { System.out.println("GrandParent Creat ...