<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>B-JUI 客戶端框架</title> <meta name="Keywords" content="B-JUI,Bootstrap,DWZ,jquery,ui,前端,框架,開源,OSC,開源框架,knaan"/> <meta name="Description" content="B-JUI, Bootstrap for DWZ富客戶端框架，基於DWZ富客戶端框架修改。主要針對皮膚，編輯器，表單驗證等方面進行了大量修改，引入了Bootstrap，Font Awesome，KindEditor，jquery.validationEngine，iCheck等眾多開源項目。交流QQ群：232781006。"/> <!-- bootstrap - css --> <link href="BJUI/themes/css/bootstrap.css" rel="stylesheet"> <!-- core - css --> <link href="BJUI/themes/css/style.css" rel="stylesheet"> <link href="BJUI/themes/blue/core.css" id="bjui-link-theme" rel="stylesheet"> <!-- plug - css --> <link href="BJUI/plugins/kindeditor_4.1.10/themes/default/default.css" rel="stylesheet"> <link href="BJUI/plugins/colorpicker/css/bootstrap-colorpicker.min.css" rel="stylesheet"> <link href="BJUI/plugins/niceValidator/jquery.validator.css" rel="stylesheet"> <link href="BJUI/plugins/bootstrapSelect/bootstrap-select.css" rel="stylesheet"> <link href="BJUI/themes/css/FA/css/font-awesome.min.css" rel="stylesheet"> <!--[if lte IE 7]> <link href="BJUI/themes/css/ie7.css" rel="stylesheet"> <![endif]--> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lte IE 9]> <script src="BJUI/other/html5shiv.min.js"></script> <script src="BJUI/other/respond.min.js"></script> <![endif]--> <!-- jquery --> <script src="BJUI/js/jquery-1.7.2.min.js"></script> <script src="BJUI/js/jquery.cookie.js"></script> <!--[if lte IE 9]> <script src="BJUI/other/jquery.iframe-transport.js"></script> <![endif]--> <!-- BJUI.all 分模塊壓縮版 --> <script src="BJUI/js/bjui-all.js"></script> <!-- 以下是B-JUI的分模塊未壓縮版，建議開發調試階段使用下面的版本 --> <!-- <script src="BJUI/js/bjui-core.js"></script> <script src="BJUI/js/bjui-regional.zh-CN.js"></script> <script src="BJUI/js/bjui-frag.js"></script> <script src="BJUI/js/bjui-extends.js"></script> <script src="BJUI/js/bjui-basedrag.js"></script> <script src="BJUI/js/bjui-slidebar.js"></script> <script src="BJUI/js/bjui-contextmenu.js"></script> <script src="BJUI/js/bjui-navtab.js"></script> <script src="BJUI/js/bjui-dialog.js"></script> <script src="BJUI/js/bjui-taskbar.js"></script> <script src="BJUI/js/bjui-ajax.js"></script> <script src="BJUI/js/bjui-alertmsg.js"></script> <script src="BJUI/js/bjui-pagination.js"></script> <script src="BJUI/js/bjui-util.date.js"></script> <script src="BJUI/js/bjui-datepicker.js"></script> <script src="BJUI/js/bjui-ajaxtab.js"></script> <script src="BJUI/js/bjui-datagrid.js"></script> <script src="BJUI/js/bjui-tablefixed.js"></script> <script src="BJUI/js/bjui-tabledit.js"></script> <script src="BJUI/js/bjui-spinner.js"></script> <script src="BJUI/js/bjui-lookup.js"></script> <script src="BJUI/js/bjui-tags.js"></script> <script src="BJUI/js/bjui-upload.js"></script> <script src="BJUI/js/bjui-theme.js"></script> <script src="BJUI/js/bjui-initui.js"></script> <script src="BJUI/js/bjui-plugins.js"></script> --> <!-- plugins --> <!-- swfupload for uploadify && kindeditor --> <script src="BJUI/plugins/swfupload/swfupload.js"></script> <!-- kindeditor --> <script src="BJUI/plugins/kindeditor_4.1.10/kindeditor-all.min.js"></script> <script src="BJUI/plugins/kindeditor_4.1.10/lang/zh_CN.js"></script> <!-- colorpicker --> <script src="BJUI/plugins/colorpicker/js/bootstrap-colorpicker.min.js"></script> <!-- ztree --> <script src="BJUI/plugins/ztree/jquery.ztree.all-3.5.js"></script> <!-- nice validate --> <script src="BJUI/plugins/niceValidator/jquery.validator.js"></script> <script src="BJUI/plugins/niceValidator/jquery.validator.themes.js"></script> <!-- bootstrap plugins --> <script src="BJUI/plugins/bootstrap.min.js"></script> <script src="BJUI/plugins/bootstrapSelect/bootstrap-select.min.js"></script> <script src="BJUI/plugins/bootstrapSelect/defaults-zh_CN.min.js"></script> <!-- icheck --> <script src="BJUI/plugins/icheck/icheck.min.js"></script> <!-- dragsort --> <script src="BJUI/plugins/dragsort/jquery.dragsort-0.5.1.min.js"></script> <!-- HighCharts --> <script src="BJUI/plugins/highcharts/highcharts.js"></script> <script src="BJUI/plugins/highcharts/highcharts-3d.js"></script> <script src="BJUI/plugins/highcharts/themes/gray.js"></script> <!-- ECharts --> <script src="BJUI/plugins/echarts/echarts.js"></script> <!-- other plugins --> <script src="BJUI/plugins/other/jquery.autosize.js"></script> <link href="BJUI/plugins/uploadify/css/uploadify.css" rel="stylesheet"> <script src="BJUI/plugins/uploadify/scripts/jquery.uploadify.min.js"></script> <script src="BJUI/plugins/download/jquery.fileDownload.js"></script> <!-- init --> <script type="text/javascript"> $(function() { BJUI.init({ JSPATH : 'BJUI/', //[可選]框架路徑 PLUGINPATH : 'BJUI/plugins/', //[可選]插件路徑 loginInfo : {url:'login_timeout.html', title:'登錄', width:400, height:200}, // 會話超時后彈出登錄對話框 statusCode : {ok:200, error:300, timeout:301}, //[可選] ajaxTimeout : 50000, //[可選]全局Ajax請求超時時間(毫秒) pageInfo : {total:'total', pageCurrent:'pageCurrent', pageSize:'pageSize', orderField:'orderField', orderDirection:'orderDirection'}, //[可選]分頁參數 alertMsg : {displayPosition:'topcenter', displayMode:'slide', alertTimeout:3000}, //[可選]信息提示的顯示位置，顯隱方式，及[info/correct]方式時自動關閉延時(毫秒) keys : {statusCode:'statusCode', message:'message'}, //[可選] ui : { windowWidth : 1200, //框架顯示寬度，0=100%寬，> 600為則居中顯示 showSlidebar : true, //[可選]左側導航欄鎖定/隱藏 clientPaging : true, //[可選]是否在客戶端響應分頁及排序參數 overwriteHomeTab : false //[可選]當打開一個未定義id的navtab時，是否可以覆蓋主navtab(我的主頁) }, debug : true, // [可選]調試模式 [true|false，默認false] theme : 'sky' // 若有Cookie['bjui_theme'],優先選擇Cookie['bjui_theme']。皮膚[五種皮膚:default, orange, purple, blue, red, green] }) // main - menu $('#bjui-accordionmenu') .collapse() .on('hidden.bs.collapse', function(e) { $(this).find('> .panel > .panel-heading').each(function() { var $heading = $(this), $a = $heading.find('> h4 > a') if ($a.hasClass('collapsed')) $heading.removeClass('active') }) }) .on('shown.bs.collapse', function (e) { $(this).find('> .panel > .panel-heading').each(function() { var $heading = $(this), $a = $heading.find('> h4 > a') if (!$a.hasClass('collapsed')) $heading.addClass('active') }) }) $(document).on('click', 'ul.menu-items li > a', function(e) { var $a = $(this), $li = $a.parent(), options = $a.data('options').toObj(), $children = $li.find('> .menu-items-children') var onClose = function() { $li.removeClass('active') } var onSwitch = function() { $('#bjui-accordionmenu').find('ul.menu-items li').removeClass('switch') $li.addClass('switch') } $li.addClass('active') if (options) { options.url = $a.attr('href') options.onClose = onClose options.onSwitch = onSwitch if (!options.title) options.title = $a.text() if (!options.target) $a.navtab(options) else $a.dialog(options) } if ($children.length) { $li.toggleClass('open') } e.preventDefault() }) //時鍾 var today = new Date(), time = today.getTime() $('#bjui-date').html(today.formatDate('yyyy/MM/dd')) setInterval(function() { today = new Date(today.setSeconds(today.getSeconds() + 1)) $('#bjui-clock').html(today.formatDate('HH:mm:ss')) }, 1000) }) //菜單-事件 function MainMenuClick(event, treeId, treeNode) { event.preventDefault() if (treeNode.isParent) { var zTree = $.fn.zTree.getZTreeObj(treeId) zTree.expandNode(treeNode, !treeNode.open, false, true, true) return } if (treeNode.target && treeNode.target == 'dialog') $(event.target).dialog({id:treeNode.tabid, url:treeNode.url, title:treeNode.name}) else $(event.target).navtab({id:treeNode.tabid, url:treeNode.url, title:treeNode.name, fresh:treeNode.fresh, external:treeNode.external}) } </script> <!-- for doc begin --> <link type="text/css" rel="stylesheet" href="/js/syntaxhighlighter-2.1.382/styles/shCore.css"/> <link type="text/css" rel="stylesheet" href="/js/syntaxhighlighter-2.1.382/styles/shThemeEclipse.css"/> <script type="text/javascript" src="/js/syntaxhighlighter-2.1.382/scripts/brush.js"></script> <link href="doc/doc.css" rel="stylesheet"> <script type="text/javascript"> $(function(){ SyntaxHighlighter.config.clipboardSwf = '/js/syntaxhighlighter-2.1.382/scripts/clipboard.swf' $(document).on(BJUI.eventType.initUI, function(e) { SyntaxHighlighter.highlight(); }) }) </script> <!-- for doc end --> </head> <body> <!--[if lte IE 7]> <div id="errorie"><div>您還在使用老掉牙的IE，正常使用系統前請升級您的瀏覽器到 IE8以上版本 <a target="_blank" href="http://windows.microsoft.com/zh-cn/internet-explorer/ie-8-worldwide-languages">點擊升級</a> 強烈建議您更改換瀏覽器：<a href="http://down.tech.sina.com.cn/content/40975.html" target="_blank">谷歌 Chrome</a></div></div> <![endif]--> <div id="bjui-window"> <header id="bjui-header"> <div class="bjui-navbar-header"> <button type="button" class="bjui-navbar-toggle btn-default" data-toggle="collapse" data-target="#bjui-navbar-collapse"> <i class="fa fa-bars"></i> </button> <a class="bjui-navbar-logo" href="#"><img src="images/logo.png"></a> </div> <nav id="bjui-navbar-collapse"> <ul class="bjui-navbar-right"> <li class="datetime"><div><span id="bjui-date"></span> <span id="bjui-clock"></span></div></li> <li><a href="#">消息 <span class="badge">4</span></a></li> <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">我的賬戶 <span class="caret"></span></a> <ul class="dropdown-menu" role="menu"> <li><a href="changepwd.html" data-toggle="dialog" data-id="changepwd_page" data-mask="true" data-width="400" data-height="260"> <span class="glyphicon glyphicon-lock"></span> 修改密碼 </a></li> <li><a href="#"> <span class="glyphicon glyphicon-user"></span> 我的資料</a></li> <li class="divider"></li> <li><a href="login.html" class="red"> <span class="glyphicon glyphicon-off"></span> 注銷登陸</a></li> </ul> </li> <li><a href="index_tree.html" title="切換為樹狀導航(寬版)" style="background-color:#ff7b61;">樹狀導航欄(寬版)</a></li> <li class="dropdown"><a href="#" class="dropdown-toggle theme blue" data-toggle="dropdown" title="切換皮膚"><i class="fa fa-tree"></i></a> <ul class="dropdown-menu" role="menu" id="bjui-themes"> <li><a href="javascript:;" class="theme_default" data-toggle="theme" data-theme="default"> <i class="fa fa-tree"></i> 黑白分明 </a></li> <li><a href="javascript:;" class="theme_orange" data-toggle="theme" data-theme="orange"> <i class="fa fa-tree"></i> 橘子紅了</a></li> <li><a href="javascript:;" class="theme_purple" data-toggle="theme" data-theme="purple"> <i class="fa fa-tree"></i> 紫羅蘭</a></li> <li class="active"><a href="javascript:;" class="theme_blue" data-toggle="theme" data-theme="blue"> <i class="fa fa-tree"></i> 天空藍</a></li> <li><a href="javascript:;" class="theme_green" data-toggle="theme" data-theme="green"> <i class="fa fa-tree"></i> 綠草如茵</a></li> </ul> </li> </ul> </nav> <div id="bjui-hnav"> <button type="button" class="btn-default bjui-hnav-more-left" title="導航菜單左移"><i class="fa fa-angle-double-left"></i></button> <div id="bjui-hnav-navbar-box"> <ul id="bjui-hnav-navbar"> <li class="active"><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-check-square-o"></i> 表單元素</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="hand-o-up"> <li><a href="form-button.html" data-options="{id:'form-button', faicon:'hand-o-up'}">按鈕</a><b><i class="fa fa-angle-down"></i></b> <ul class="menu-items-children"> <li><a href="form-input.html" data-options="{id:'form-input', faicon:'terminal'}">文本框</a></li> <li><a href="form-select.html" data-options="{id:'form-select', faicon:'caret-square-o-down'}">下拉選擇框</a></li> </ul> </li> <li><a href="form-input.html" data-options="{id:'form-input', faicon:'terminal'}">文本框</a></li> <li><a href="form-select.html" data-options="{id:'form-select', faicon:'caret-square-o-down'}">下拉選擇框</a></li> <li><a href="form-checkbox.html" data-options="{id:'form-checkbox', faicon:'check-square-o'}">復選、單選框</a></li> </ul> <ul class="menu-items" data-tit="表單Demo" data-faicon="list"> <li><a href="form.html" data-options="{id:'form-demo', faicon:'th-large'}">表單示例</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-table"></i> 表格</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="table"> <li><a href="table.html" data-options="{id:'table', faicon:'table'}">普通表格</a></li> <li><a href="table-fixed.html" data-options="{id:'table-fixed', faicon:'list-alt'}">固定表頭表格</a></li> <li><a href="table-edit.html" data-options="{id:'table-edit', faicon:'indent'}">可編輯表格</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-table"></i> Datagrid(beta)</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="table"> <li><a href="datagrid-convertable.html" data-options="{id:'datagrid-convertable', faicon:'table'}">轉換普通表格</a></li> <li><a href="datagrid-demo.html" data-options="{id:'datagrid-demo', faicon:'table'}">完整示例</a></li> <li><a href="datagrid-datatype.html" data-options="{id:'datagrid-datatype', faicon:'table'}">三種數據類型</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-plane"></i> 彈出窗口</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="plane"> <li><a href="dialog.html" data-options="{id:'dialog', faicon:'plane'}">彈出窗口</a></li> <li><a href="alert.html" data-options="{id:'alert', faicon:'info-circle'}">信息提示</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-image"></i> 圖形報表</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="image"> <li><a href="highcharts.html" data-options="{id:'chart', faicon:'image'}">Highcharts圖表</a></li> <li><a href="echarts.html" data-options="{id:'echarts', faicon:'image'}">ECharts圖表</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-coffee"></i> 框架組件</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="coffee"> <li><a href="tabs.html" data-options="{id:'tabs', faicon:'columns'}">選項卡</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-bug"></i> 其他插件</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="bug"> <li><a href="ztree.html" data-options="{id:'ztree', faicon:'tree'}">zTree</a></li> <li><a href="ztree-select.html" data-options="{id:'ztree-select', faicon:'caret-square-o-down'}">zTree下拉選擇</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-database"></i> 綜合應用</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="database"> <li><a href="table-layout.html" data-options="{id:'table-layout', faicon:'refresh'}">局部刷新1</a></li> </ul> </div> </li> <li><a href="javascript:;" data-toggle="slidebar"><i class="fa fa-file-word-o"></i> 在線文檔</a> <div class="items hide" data-noinit="true"> <ul class="menu-items" data-faicon="star-o" data-tit="框架介紹"> <li><a href="doc/base/filelist.html" data-options="{id:'doc-file', faicon:'caret-right'}">文件詳解</a></li> <li><a href="doc/base/structure.html" data-options="{id:'doc-structure', faicon:'caret-right'}">頁面結構</a></li> <li><a href="doc/base/init.html" data-options="{id:'doc-init', faicon:'caret-right'}">框架初始化</a></li> <li><a href="doc/base/hnav.html" data-options="{id:'doc-hnav', faicon:'caret-right'}">橫向導航菜單</a></li> <li><a href="doc/base/navtab.html" data-options="{id:'doc-navtab', faicon:'caret-right'}">標簽工作區(navtab)</a></li> <li><a href="doc/base/dialog.html" data-options="{id:'doc-dialog', faicon:'caret-right'}">彈窗工作區(dialog)</a></li> <li><a href="doc/base/idname.html" data-options="{id:'doc-idname', faicon:'caret-right'}">元素ID命名規范</a></li> <li><a href="doc/base/data.html" data-options="{id:'doc-data', faicon:'caret-right'}">data屬性</a></li> <li><a href="doc/base/api.html" data-options="{id:'doc-api', faicon:'caret-right'}">jQuery API調用</a></li> <li><a href="doc/base/event.html" data-options="{id:'doc-event', faicon:'caret-right'}">事件</a></li> <li><a href="doc/base/url.html" data-options="{id:'doc-url', faicon:'caret-right'}">URL動態賦值</a></li> <li><a href="doc/theme/color.html" data-options="{id:'doc-theme', faicon:'caret-right'}">顏色值</a></li> </ul> <ul class="menu-items" data-faicon="th" data-tit="框架組件"> <li><a href="doc/navtab/navtab.html" data-options="{id:'doc-navtab', faicon:'caret-right'}">標簽navtab</a></li> <li><a href="doc/navtab/navtab-op.html" data-options="{id:'doc-navtab', faicon:'caret-right'}">navtab參數</a></li> <li><a href="doc/dialog/dialog.html" data-options="{id:'doc-dialog', faicon:'caret-right'}">彈窗dialog</a></li> <li><a href="doc/dialog/dialog-op.html" data-options="{id:'doc-dialog', faicon:'caret-right'}">dialog參數</a></li> <li><a href="doc/alertmsg/alertmsg.html" data-options="{id:'doc-alertmsg', faicon:'caret-right'}">信息提示alertmsg</a></li> <li><a href="doc/form/datepicker.html" data-options="{id:'doc-datepicker', faicon:'caret-right'}">日期選擇器</a></li> <li><a href="doc/form/spinner.html" data-options="{id:'doc-spinner', faicon:'caret-right'}">微調器</a></li> <li><a href="doc/form/lookup.html" data-options="{id:'doc-lookup', faicon:'caret-right'}">查找帶回</a></li> <li><a href="doc/form/tags.html" data-options="{id:'doc-tags', faicon:'caret-right'}">自動完成標簽</a></li> <li><a href="doc/form/upload.html" data-options="{id:'doc-upload', faicon:'caret-right'}">Ajax上傳組件</a></li> <li><a href="doc/other/contextmenu.html" data-options="{id:'doc-contextmenu', faicon:'caret-right'}">右鍵菜單</a></li> </ul> <ul class="menu-items" data-faicon="spinner" data-tit="Ajax"> <li><a href="doc/ajax/callback.html" data-options="{id:'doc-callback', faicon:'caret-right'}">回調函數</a></li> <li><a href="doc/ajax/form.html" data-options="{id:'doc-form-submit', faicon:'caret-right'}">提交表單</a></li> <li><a href="doc/ajax/search.html" data-options="{id:'doc-search', faicon:'caret-right'}">搜索表單</a></li> <li><a href="doc/ajax/load.html" data-options="{id:'doc-load', faicon:'caret-right'}">加載(局部刷新)</a></li> <li><a href="doc/ajax/action.html" data-options="{id:'doc-action', faicon:'caret-right'}">執行動作</a></li> </ul> <ul class="menu-items" data-faicon="table" data-tit="表格相關"> <li><a href="doc/table/style.html" data-options="{id:'doc-table-style', faicon:'caret-right'}">表格樣式</a></li> <li><a href="doc/table/order.html" data-options="{id:'doc-table-order', faicon:'caret-right'}">字段排序</a></li> <li><a href="doc/table/paging.html" data-options="{id:'doc-table-paging', faicon:'caret-right'}">分頁組件</a></li> <li><a href="doc/table/selected.html" data-options="{id:'doc-table-selected', faicon:'caret-right'}">行選中操作</a></li> <li><a href="doc/table/fixed.html" data-options="{id:'doc-table-fixed', faicon:'caret-right'}">固定表頭</a></li> <li><a href="doc/table/edit.html" data-options="{id:'doc-table-edit', faicon:'caret-right'}">可編輯表格</a></li> </ul> <ul class="menu-items" data-faicon="table" data-tit="Datagrid"> <li><a href="doc/datagrid/datagrid-demo.html" data-options="{id:'doc-datagrid-demo', faicon:'caret-right'}">datagrid示例</a></li> <li><a href="doc/datagrid/datagrid-op.html" data-options="{id:'doc-datagrid-op', faicon:'caret-right'}">datagrid參數</a></li> <li><a href="doc/datagrid/datagrid-columns.html" data-options="{id:'doc-datagrid-columns', faicon:'caret-right'}">columns參數</a></li> </ul> <ul class="menu-items" data-faicon="image" data-tit="圖形報表(插件)"> <li><a href="doc/chart/highcharts.html" data-options="{id:'', faicon:'caret-right'}">Highcharts圖表</a></li> <li><a href="doc/chart/echarts.html" data-options="{id:'', faicon:'caret-right'}">ECharts圖表</a></li> </ul> <ul class="menu-items" data-faicon="bug" data-tit="其他插件"> <li><a href="doc/plugin/ztree.html" data-options="{id:'doc-ztree', faicon:'caret-right'}">zTree</a></li> <li><a href="doc/plugin/checkbox.html" data-options="{id:'doc-icheck', faicon:'caret-right'}">復選/單選</a></li> <li><a href="doc/plugin/select.html" data-options="{id:'doc-selectpicker', faicon:'caret-right'}">下拉選擇框</a></li> <li><a href="doc/plugin/validate.html" data-options="{id:'doc-nicevalidator', faicon:'caret-right'}">表單驗證</a></li> <li><a href="doc/plugin/kindeditor.html" data-options="{id:'doc-kindeditor', faicon:'caret-right'}">KindEditor</a></li> <li><a href="doc/plugin/ajaxdownload.html" data-options="{id:'doc-ajaxdownload', faicon:'caret-right'}">Ajax Download</a></li> </ul> </div> </li> <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-cog"></i> 系統設置 <span class="caret"></span></a> <ul class="dropdown-menu" role="menu"> <li><a href="#">角色權限</a></li> <li><a href="#">用戶列表</a></li> <li class="divider"></li> <li><a href="#">關於我們</a></li> <li class="divider"></li> <li><a href="#">友情鏈接</a></li> </ul> </li> </ul> </div> <button type="button" class="btn-default bjui-hnav-more-right" title="導航菜單右移"><i class="fa fa-angle-double-right"></i></button> </div> </header> <div id="bjui-container" class="clearfix"> <div id="bjui-leftside"> <div id="bjui-sidebar-s"> <div class="collapse"></div> </div> <div id="bjui-sidebar"> <div class="toggleCollapse"><h2><i class="fa fa-bars"></i> 導航欄 <i class="fa fa-bars"></i></h2><a href="javascript:;" class="lock"><i class="fa fa-lock"></i></a></div> <div class="panel-group panel-main" data-toggle="accordion" id="bjui-accordionmenu"> </div> </div> </div> <div id="bjui-navtab" class="tabsPage"> <div class="tabsPageHeader"> <div class="tabsPageHeaderContent"> <ul class="navtab-tab nav nav-tabs"> <li data-url="index_layout.html" data-faicon="home"><a href="javascript:;"><span><i class="fa fa-home"></i> #maintab#</span></a></li> </ul> </div> <div class="tabsLeft"><i class="fa fa-angle-double-left"></i></div> <div class="tabsRight"><i class="fa fa-angle-double-right"></i></div> <div class="tabsMore"><i class="fa fa-angle-double-down"></i></div> </div> <ul class="tabsMoreList"> <li><a href="javascript:;">#maintab#</a></li> </ul> <div class="navtab-panel tabsPageContent"> <div class="navtabPage unitBox"> <div class="bjui-pageContent" style="background:#FFF;"> Loading... </div> </div> </div> </div> </div> <footer id="bjui-footer">Copyright © 2013 - 2015 <a href="http://www.cdjinyang.com/" target="_blank">成都錦楊科技</a> <!-- <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1252983288'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s23.cnzz.com/stat.php%3Fid%3D1252983288%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));</script> --> </footer> </div> </body> </html>