-----------------------------------------------------------------------------
主页面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. MySQL 8.0用户和角色管理

    MySQL 8.0用户和角色管理 MySQL8.0新加了很多功能,其中在用户管理中增加了角色的管理,默认的密码加密方式也做了调整,由之前的sha1改为了sha2,同时加上5.7的禁用用户和用户过期的设 ...

  2. Java基础知识_毕向东_Java基础视频教程笔记(5-10 面向对象)

    06天-05-面向对象(帮助文档的制作javadoc):java文档生成命令:javadoc -d filepatn demo.java   -author -version(可选)一个类中默认会有一 ...

  3. C#语言基础知识

    一. string i_str = "321"; string 型,强制转换成 int 型 int i_int1 = int.parse(i_str); string 型,强制转换 ...

  4. mysql实现自增函数

    这两天在思考怎么生成数据库随机名称,思前想后觉得还是利用自增的逻辑主键是最方便快捷的,于是便尝试着获取一种自增的mysql函数 自增mysql函数 BEGIN DECLARE id INT DEFAU ...

  5. Java - 35 Java 实例

    Java 实例 本章节我们将为大家介绍 Java 常用的实例,通过实例学习我们可以更快的掌握 Java 的应用. Java 环境设置实例 Java 实例 – 如何编译一个Java 文件? Java 实 ...

  6. three.js学习：点光源+动画的实现

    与前几个教程类似,场景和相机等设置就不再重复声明了.这里只列出新学的内容. 1.圆柱体(圆锥体)的初始化 function initObject() { var geometry = new THRE ...

  7. SUI-mobile起步

    减少不必要造轮子的过程,于是在APP项目中推进SUI Mobile的使用,主要目的是使用它的一些基本样式,以及各种封装好的组件,但并没有创建单页应用. 刚刚开始使用,使用之中遇到一个槽点,记录一下(主 ...

  8. <创新思维与实践>总结梳理

    2017年12月3-4号 培训了两天的创新思维与实践,有时间要补充总结一下. ---todo

  9. android开发 写一个自定义形状的按键

    步骤: 1.在drawable 文件夹中创建一个xml布局文件. 2.修改布局文件 3.在需要使用背景的按键中导入布局. 创建布局文件: 修改布局文件: <?xml version=" ...

  10. ASP.NET WebApi 图片上传

    以下是代码的实现过程: Html页面表单布局: <form id="UpPicture" enctype="multipart/form-data" ac ...