我有一个模态表,其中包含多个引导程序下拉列表。这是一个溢出:自动滚动容器。因此,为防止下拉菜单被截断,我编写了一个jquery函数。现在的问题是,当我单击一个下拉列表时,它会打开,如果我打开另一个,则上一个下拉列表不会被关闭。 e.preventDefault和e.stopPropogation没有帮助。
e.preventDefault和e.stopPropogation没有帮助。
<div class="btn-group action-dropdown btn-action fright dropdown"> .
<button class="btn btn-primary" data-toggle"{{(dafaultTableAction!=undefined?'':'dropdown')}}">
<span ng-click="dafaultTableAction.popupToConfirm?callActionWithWarning(item,dafaultTableAction): callTableRecordActionEvent(null,item,dafaultTableAction,(dafaultTableAction.questActionId.rule=='VIEW'?true:false))"> {{dafaultTableAction!=null?dafaultTableAction.title:'Take Action'}} .
</span>
</button>
<button class="btn list dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
<i class="fa fa-angle-down"></i>
</button>
<div class="dropdown-menu events-dropdown olt-dropdown" id="progress">
<ul>
<li class="dropdown-item" ng-repeat='tableAction in tableActionList' ng-click="tableAction.popupToConfirm?callActionWithWarning(item,tableAction):callTableRecordActionEvent(null,item,tableAction,(tableAction.questActionId.rule=='VIEW'?true:false))">
</li>
</ul>
</div>
</div>
var dropdownMenu;
var dropdownMenuBtn;
$('.table-box').on('show.bs.dropdown', function (e) {
dropdownMenu = $(e.target).find('.dropdown-menu');
dropdownMenuBtn = $(e.target).find('.dropdown-toggle');
$('.olt-view .table-box').append(dropdownMenu.detach());
e.stopPropagation();
e.preventDefault();
dropdownMenu.css('display', 'block');
dropdownMenu.position({
'my': 'right top',
'at': 'right bottom',
'of': $(e.relatedTarget)
})
});
$('.table-box').on('hide.bs.dropdown', function(e) {
e.stopPropagation();
e.preventDefault();
$(e.target).append(dropdownMenu.detach());
dropdownMenu.hide();
dropdownMenu.css('display','none');
});