jquery tmpl生成导航
引入
<script src="jquery.tmpl.min.js"></script>
html
<ul class="nav" id="side-menu">
</ul> tmpl
<script id="tmpl-box" type="text/x-jquery-tmpl">
{{if $data.eq < 4}}
<li class="sidebar{{= $data.eq}}-li" data-memu="true">
<a href="{{= $data.url}}"><i class="icon icon{{= $data.eq}}" ></i></a>
<ul class="nav nav-second-level collapse collapseUl">
<li style="border-bottom: 0px !important">
<div class="bubble_diailog size_1">{{= $data.name}}
<i class="l"></i>
<b class="l"></b>
</div>
</li>
</ul>
</li>
{{else}}
<li class="sidebar{{= $data.eq}}-li" data-memu="true">
<a href="javascript:;"><i class="icon icon{{= $data.eq}}"></i></a>
<ul class="nav nav-second-level">
<li><a href="javascript:;" class="null-active">{{= $data.name}}</a></li>
{{each(i,obj) $data.children}}
<li><a href="{{= url}}">{{= name}}</a></li>
{{/each}}
</ul>
</li>
{{/if}}
</script>
//生成导航栏
tree = [
{"eq":1,"name":"工作台","url":"/main"},
{"eq":2,"name":"待办事项","url":"/calendar/event/main"},
{"eq":3,"name":"客户管理","url":"/client/client/main"},
{"eq":4,"name":"统计分析",
"children":[
{"name":"业务员统计","url":"/sys/statistics/client"},
{"name":"客户行业统计","url":"/sys/statistics/client?type=profession"},
{"name":"优化师统计","url":"/sys/statistics/client?type=sem"},
{"name":"客户分类统计","url":"/sys/statistics/client?type=level"},
{"name":"客户状态统计","url":"/sys/statistics/client?type=status"},
{"name":"客户联系统计","url":"/sys/statistics/client?type=contact"},
{"name":"客户建档时间统计","url":"/sys/statistics/client?type=increment"},
{"name":"优化师服务记录查询","url":"/sys/statistics/client?type=serviceRecord"},
{"name":"业务员联系记录查询","url":"/sys/statistics/client?type=contactRecord"}
]
},
{"eq":5,"name":"系统设置",
"children":[
{"name":"部门信息","url":"/sys/department/main"},
{"name":"员工设置","url":"/sys/user/main"},
{"name":"业务设置","url":"/sys/busi/main"},
{"name":"角色设置","url":"/sys/role/main"},
{"name":"客户共享","url":"/client/clientShare/main"},
{"name":"客户移交","url":"/client/clientTransfer/main"},
{"name":"其他设置","url":"/sys/setting/main"}
]
}
]
$("#side-menu").empty();
$("#tmpl-box").tmpl(tree).appendTo("#side-menu");
jquery tmpl生成导航的更多相关文章
- jquery tmpl 详解
官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意 ...
- jquery.tmpl.js 模板引擎用法
1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type ...
- MVC - 11(下)jquery.tmpl.js +ajax分页
继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...
- jQuery .tmpl() 用法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jquery.tmpl.min.js--前端实现模版--数据绑定--详解
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据
jquery.tmpl.js 是一个模板js ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...
- [转载]jquery tmpl使用方法
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
- jQuery .tmpl(), .template()学习资料小结
昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里.官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options ...
- jquery tmpl 详解(转)
动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等. 这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在 ...
随机推荐
- [经验]怎么删除“通过QQ/TIM发送到”右键菜单
首先打开QQ主面板上的系统设置 选择[基本设置]-[文件管理]菜单,并将如图所示的选项去掉勾选即可
- linux 复制文件
1 复制指定目录下的全部文件到另一个目录中. 若dir2目录不存在,则可以直接使用: cp -r dir1 dir2 若dir2目录存在,则需要使用: cp -r dir1/. dir2 若dir2目 ...
- OSPFv3与OSPF的配置
IPv6 路由-OSPFv3 实验目的 1. 掌握 OSPFv3 的配置方法 2. 掌握在帧中继环境下 OSPFv3 的配置方法 3. 掌握 OSPFv3 NSSA 的配置方法 4. ...
- 【网址】ILSpy,C# .net/dot net的反编译工具
ILSpy官网:http://ilspy.net/ ILSpy中文版:http://www.fishlee.net/soft/ilspy_chs/
- iOS调试踩过的坑 以及instruments使用指南
1. 低版本的XCode工程中包含的lib,在高版本的XCode中会编译错误,提示找不到库,故需要恢复libC++库到原位置上,参考 https://github.com/devdawei/libst ...
- springcloud-feign组件实现声明式的调用
11.使用feign实现声明式的调用 使用RestTemplate+ribbon已经可以完成对服务端负载均衡的调用,为什么还要使用feign? @RequestMapping("/hi&qu ...
- iOS 性能优化总结
卡顿产生的原因 在 VSync信号到来后,系统图形服务会通过 CADisplayLink等机制通知 App,App主线程开始在 CPU中计算显示内容,比如视图的创建.布局计算.图片解码.文本绘制等.随 ...
- Vue入门笔记(二)--基础部分之条件渲染
github地址:https://github.com/iTao9354/basicVue/tree/master/conditional%20rendering(demo01-03) 一.v-if ...
- 1.2 JAVA多线程实现
线程和进程 进程:是执行中一段程序, 进程是系统进行资源分配和调度的一个独立单位. 线程:比进程更小的能独立运行的基本单位,单个进程中执行中每个任务就是一个线程.线程是进程中执行运算的最小单位. Th ...
- Linux内核分析--进程创建,执行,切换
学号:351 原创作品转载请注明出处本实验来源 https://github.com/mengning/linuxkernel/ 实验要求 从整理上理解进程创建.可执行文件的加载和进程执行进程切换,重 ...
