AppCan TreeView
来源:互联网 发布:品茗安全计算软件 编辑:程序博客网 时间:2024/05/20 22:37
效果如下:
CSS:
//去掉二级列表中的 右箭头
<style type="text/css">
.fa-angle-right{
display:none
}
</style>
HTML:
<div id="treeview" class="sc-bg">
</div>
JS:
var tv = appcan.treeview({
selector : "#treeview",
defaultOpen : 1 , //默认打开第几项,必须包含数据
});
tv.set([{
header : "列表(list)",
content : [{
title : '<div class=" ub bc-text ub-ac"><div class="checkbox umar-r"> <input type="checkbox" class="uabs ub-con"> </div> <div class=" ub-f1 marg-l ub ub-ac ut-m line1"> 自动登录 </div></div>',
name : "listview",
hasAngle:false,
id:'test'
// url : "UIcontrol/listview.html"
}, {
title : '分组列表',
name : "listview",
url : "UIcontrol/lv_group.html"
}]
}, {
header : "标题导航栏(header)",
content : [{
title : '图片标题',
name : "control",
url : "UIcontrol/nav-icon.html"
}, {
title : 'FontAwesome图片标题',
name : "control",
url : "UIcontrol/nav-fa.html"
}]
}]);
tv.on('listviewClick', function(ele, data, obj) {
if (data.name && data.url) {
// appcan.locStorage.setVal("lv_index", ele.data("index"));
// appcan.window.open(data.name, data.url, 10);
}
});
tv.on('click', function(ele, obj, subobj) {
if (obj.name && obj.url) {
appcan.window.open(obj.name, obj.url, 10);
}
});
动态数据绑定可参考:
http://blog.csdn.net/clareqi/article/details/52472512
- AppCan TreeView
- appCan开发:treeview的使用例子
- AppCan
- appcan 杂记
- AppCan教程
- appcan mediacss
- appcan 笔记
- treeView
- treeview
- treeview
- treeview
- TreeView
- TreeView
- treeview
- TreeView
- TreeView
- TreeView
- TreeView
- ionic3 (三)设置页制作
- windows下6种IO模型
- MySQL数据库查询常用语句
- SqlServer集合运算
- LeetCode---231. Power of Two
- AppCan TreeView
- 属性动画
- linux 入门
- Android Context 上下文 你必须知道的一切
- js,jquery常用拼接html方法
- HDU 5127 Dogs' Candies(暴力)
- CodeForces #426 div2 B The Festive Evening
- javascript时间戳 转换成时间
- vb.net 为PrintPreviewDialog控件添加新按钮