更改指定bootstrap"modal-open"类而不是body的位置

Question

目前

modal-open

打开模态时分配给正文.如何更改添加类的位置而不是正文.

谢谢你的帮助.

Answer 1

你必须改变添加modal-open的js.作为行为,这有点奇怪,无论如何你可以轻声或粗暴地做.

轻轻地:截取模态单击以显示并删除类到主体添加到另一个元素:

//首先将Modal添加到Body中,然后将其删除并添加到另一个元素中

$('#myModal').on('shown.bs.modal', function (e) {
  $('body').removeClass('modal-open');
  $('#myCustomElement').addClass('modal-open');
})

然后拦截模态的结束并添加第二次删除的执行:

$('#myModal').on('hidden.bs.modal', function (e) {
   $('#myCustomElement').removeClass('modal-open');
})

残酷的方法,避免模态打开它不必要添加到body元素:进入TwitterBootstrap目录> js打开modal.js搜索modal-open,你会发现(在3.2.0版本上):

在

 Modal.prototype.show

你会找到

this.$body.addClass('modal-open')

在Modal.prototype.hide 你会找到

this.$body.removeClass('modal-open')

你要改的目标addClass和removeClass并更换这些说明,如果你有一个固定的元素是很简单(例如:$('#myFixedElement').addClass('modal-open')如果它是一个动态的元素,它是复杂的,你就必须再次进行拦截显示功能添加global var在JS让modal.js知道并阅读你的目标元素.但你也可以改变这些功能的签名,但我真的不建议你这样做,基本上你会让你的代码太难以保持.