jquery与anglarjs下根据下标折叠或者展开按钮(含全部展开与全部折叠)

由于展开折叠时顺序容易出错,

html---------

<div class="header">
<ul class="clear">
<li class="CS_return hide">
<i class="turnBack hide"></i>
</li>
<!-全部 -->
<li class="ExpandAll hand" ng-click="ExpandAll()">全部展开</li>
<li class="CollapseAll hand" ng-click="CollapseAll()">全部折叠</li>
</ul>
</div>
<ul class="main_center clear" style="overflow: auto;">
<li class="Transferrecord posion_one">
<div class="info">
<div class="on-off" data-index="1" ng-click="zhedie($event)">
2.审批</div>
</div>
</li>
<li class="Transferrecord posion_two">
<div class="info">
<div class="on-off" data-index="1" ng-click="zhedie($event)">
3.处理</div>
</div>
 
</li>
<li class="Transferrecord posion">
<div class="info">
<div class="on-off" data-index="1" ng-click="zhedie($event)">
4.记录</div>
</div>
<div class="information informl">
 
</div>
 
</div>
</li>
</ul>
----------------------js-------------
// 按钮旋转
$scope.zhedie = function($event){
var $this = $($event.target)
var index = $this.attr("data-index");
if(index == 1){
$this.parents(".info").siblings(".newcont").slideUp();
$this.parents(".info").siblings(".information").slideUp();
$this.attr("data-index","2");
$this.css("background","url(/images/packUp.png) no-repeat 5px 13px");
}
if(index == 2){
$this.parents(".info").siblings(".newcont").slideDown();
$this.parents(".info").siblings(".information").slideDown();
$this.attr("data-index","1");
$this.css("background","url(/images/unfold_tree.png) no-repeat 5px 13px");
}
}
$scope.ExpandAll = function(){
$(".on-off").attr("data-index","1");
$(".on-off").css("background","url(/images/unfold_tree.png) no-repeat 5px 13px");
$(".on-off").parents(".info").siblings(".newcont").slideDown();
$(".on-off").parents(".info").siblings(".information").slideDown();
 
}
$scope.CollapseAll = function(){
$(".on-off").attr("data-index","2");
$(".on-off").css("background","url(/images/packUp.png) no-repeat 5px 13px");
$(".on-off").parents(".info").siblings(".newcont").slideUp();
$(".on-off").parents(".info").siblings(".information").slideUp();
}

猜你喜欢

转载自www.cnblogs.com/loveAline/p/9377326.html
今日推荐