-----------------------------------------------------------------------------
主页面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. JVM性能、多线程排查常用命令

    最近遇到很一个很棘手的多线程问题,跟踪了几天终于解决了,在此记录跟踪过程的常用命令,后期有空再做具体的事件总结.软件的开发一定要有监控,一定要有监控,一定要有监控,重要的事情说三遍.没有监控的软件就是 ...

  2. flask框架get post方式

    设置路由的访问方式get post常用的两种 # -*- coding: utf-8 -*- # Flask hello world from flask import Flask, redirect ...

  3. WPF Storyboard 动画播放完毕时触发的事件

    /*故事版*/ Storyboard ClSto2; public PopUpWindow() { /*播放完毕,将当前窗体关闭*/ ClSto2.Completed += (s, e) => ...

  4. TIDB-cenos7开发环境搭建

    1.安装centos7,注意要安装桌面,如果最小化安装,无法使用IDE了 关闭防火墙或者打开4000端口 systemctl stop firewalld.service #停止firewall sy ...

  5. tensorflowwindows安装

    1.在python官网下载3.5 64位版本的python,并进行安装 https://www.python.org/ 2.进行安装,配置环境变量 3.命令行执行pip3 install numpy ...

  6. Eureka 注册中心 简单搭建

    直接上代码:配置文件截图 server.port= spring.application.name=eureka-server eureka.instance.hostname=127.0.0.1 # ...

  7. poi 导入Excel解析 2003 2007

    Workbook wb = WorkbookFactory.create(new FileInputStream(file)); Sheet sheet = wb.getSheetAt(0);// 第 ...

  8. 【python】python函数式编程、高阶函数

    1.map() : python内置的高阶函数,接收一个函数f和一个list,并通过把函数f依次作用在list的每个元素上,得到一个新的list并            返回. def f(x): r ...

  9. pymysql-connect阻塞

    class Connection(object): """ Representation of a socket with a mysql server. The pro ...

  10. 代码：CSS仿制 苹果按钮图标

    首先,先复习一下:CSS的线性渐变.径向渐变 .linear{ background-image:-webkit-linear-gradient(90deg,#f8f8f8 20%,#dae9fa 9 ...