首页 > 代码库 > amazeui折叠面板智能化展开
amazeui折叠面板智能化展开
2016年12月12日 21:05:18 星期一
场景: 我拿这个组件用作管理后台的侧边栏
效果: 根据当前访问的url不同, 展开不同的面板
amazeui折叠面板
js代码:
1 <script type="application/javascript"> 2 var nowUrl = ‘http://xxxx‘; 3 var dls =document.getElementById("sidebar").getElementsByTagName("dl"); //获取所有面板 4 for (var i = 0; i < dls.length; i++) { 5 var links = dls[i].getElementsByTagName("a"); //获取每个面板中的a标签 6 7 for (var j=0; j<links.length; j++) { 8 if (links[j].href =http://www.mamicode.com/= nowUrl.substring(0, nowUrl.length-1)) { 9 dls[i].setAttribute(‘class‘, ‘am-accordion-item am-active‘);10 var dds = dls[i].getElementsByTagName("dd");11 dds[0].setAttribute(‘class‘, ‘am-accordion-bd am-collapse am-in‘);12 break; //如果匹配到, 则跳出整个面板(dl)13 } else {14 //把其它的面板(dl)都收起来15 dls[i].setAttribute(‘class‘, ‘am-accordion-item‘);16 var dds = dls[i].getElementsByTagName("dd");17 dds[0].setAttribute(‘class‘, ‘am-accordion-bd am-collapse‘);18 }19 }20 }21 22 </script>
amazeui折叠面板智能化展开
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。