选择选项卡会导致页面随机滚动,例如选择选项卡可以将页面几乎一直滚动到顶部,然后我必须向下滚动才能看到选项卡的内容,如果我选择另一个选项卡页面再次滚动.
标签的内容大小可变,有些元素比其他元素多,所以它们自然具有不同的高度,但我不确定这是否是随机页面滚动的原因.
$(function () { $('body').on('click','a[ng-click="select()"]',function (event) { event.preventDefault(); }); });
另一个丑陋的解决方案是我将tabset包装在div中并在div上设置一个高度
<div class="col-md-12" id="profile-nav-tabs" style=" height:500px; overflow-y: auto; overflow-x:hidden "> <tabset justified="true"> <tab heading="{{::strings.profile}}"> <br /> <div ng-include="'tab-profile.PHP'"></div> </tab> .... more tabs </tabset> </div>
我遇到了同样的问题.在跟踪代码之后,我认为这是tabset指令的错误.
解决方案是(一步一步):
>修改tabset.html,删除[ng-class =“{active:tab.active}”]
>修改[tab]指令的范围.$watch(‘active’)的处理程序.
>使用angular.element的addClass和removeClass函数添加/删除活动类.
link: function(scope,elm,attrs,tabsetCtrl,transclude) { scope.$watch('active',function(active) { /*if (active) { tabsetCtrl.select(scope); }*/ var idx = tabsetCtrl.tabs.indexOf(scope); var elmPane = angular.element(elm[0]).parent().next().children()[idx]; //li->ul->div(tab-content)->div(tab-pane) if (active) { tabsetCtrl.select(scope); angular.element(elmPane).addClass('active'); } else { angular.element(elmPane).removeClass('active'); } });