我正在使用bootstrap和Parse框架来构建一个小的webapp.但是那些Bootstrap模态在关闭后不断向正文添加填充.怎么解决这个?
我试着把这段代码放在我的javascript中:
$('.modal').on('hide.bs.modal', function (e) {
$("element.style").css("padding-right","0");
});
但它不起作用.有人知道如何解决这个问题吗?
我的代码:
<button type="button" class="btn btn-lg btn-default" data-toggle="modal" data-target="#loginModal">Admin panel</button>
<div id="loginModal" class="modal fade" role="dialog">
<div class="modal-dialog modal-sm">
<!-- Modal content -->
<div class="modal-content">
<!-- header -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Login</h4>
</div>
<!-- body -->
<div class="modal-body text-center" >
<input class='form-control' type="text" id="userName" placeholder="Username" ng-model='username'>
<input class='form-control' type="password" id="password" placeholder="Password" ng-model='password'>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="loginButton" ng-click="goToAdminPanel()">Login</button>
<button type="button" class="btn btn-default" data-dismiss="modal" id="closeButton">Close</button>
</div>
</div>
</div>
</div>
</div>
<div id="adminPanel" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content -->
<div class="modal-content">
<!-- header -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Admin Panel</h4>
</div>
<!-- body -->
<div class="modal-body" >
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="saveButton">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal" id="closeButton">Close</button>
</div>
</div>
</div>
</div>
$scope.goToAdminPanel = function(){
Parse.User.logIn($scope.username,$scope.password,{
success: function(user){
$('#loginModal').modal('hide');
$('#adminPanel').modal();
},
error: function(user, error) {
alert('Wrong username and/or password');
}
});
}
我正在使用bootstrap和Parse框架来构建一个小的webapp.但是那些Bootstrap模态在关闭后不断向正文添加填充.怎么解决这个?
解决方法:
这可能是Bootstrap模式的一个小故障.从我的测试来看,似乎问题是#adminPanel正在初始化,而#loginModal尚未完全关闭.解决方法可以通过删除#adminPanel和#loginModal上的淡入淡出类来删除动画,或者在调用$(‘#adminPanel’)之前设置超时(~500ms).modal();.希望这可以帮助.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。