有没有一种已知的方法可以让summernote模态从bootstrap模态中爆发出来?
我有一个普通的modal,里面有一个summernote元素,没有什么特别的。
当我使用summernote功能时,如果我在bootstrap模式中使用summernote,这就是我得到的:
JS:
$('#dropper').on( "show.bs.modal", function() {
$('#dropping').summernote({
height: 300
});
})
HTML:
<div id="dropper" class="modal fade" tabindex="-1" data-backdrop="static" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div id="dropping">text...</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left">
<span class='fa fa-paperclip '></span>
Attach Digital Assets
</button>
<div class="btn-group">
<button type="button" class="btn btn-default opacity75" class="close" data-dismiss="modal">
× Cancel
</button>
<button type="button" class="btn btn-warning" href="javascript:postDrop()">
Post Status Update
<span class='fa fa-bullhorn '></span>
</button>
</div>
</div>
</div>
</div>
</div>
完整Bootply:http://bootply.com/113808
7条答案
按热度按时间vltsax251#
在summernote 0.6.13+中,尝试使用对话框InBody-Parameter初始化:
toe950272#
我也遇到了同样的问题,由于时间紧迫,我想出了这个解决方案(本质上是把summernote的模态转换成“正常”的div,而不是显式的模态,即。删除类'modal'):-
summernote.js(编辑完整文件):-
查找以下行并更改为:-
然后添加一些自定义的jQuery代码到调用summernote的地方:
最后添加一些css:-
希望能帮上忙?
hsvhsicv3#
我以前遇到过同样的问题,并通过以下步骤解决了它们:
首先,确保在创建summernote示例时指定
dialogsInBody: true
。其次,为了支持summernote中使用的嵌套多引导模式对话框,并支持显示工具提示和弹出框,请在全局位置注册以下事件处理程序:
前面的代码将支持嵌套的引导模态对话框和工具提示和弹出框。下图显示了结果:
您可以调整上述z索引为您所需的值。
以下发布描述了这些代码:
https://github.com/summernote/summernote/issues/2644https://github.com/summernote/summernote/issues/2457
wwodge7n4#
因为你在另一个模态中打开了一个模态。这不是推荐的做法
http://getbootstrap.com/javascript/#modals
nwlqm0z15#
我也遇到了这个问题,伙计们,另一个问题出现了。当summernote模式关闭时,父模式滚动被破坏。这就是解决办法。我只是在summernote.js的第2020行添加了这个$(“body”).addClass(“modal-open”)。在“hideDialog”方法中。
enter image description here
ktca8awb6#
我在bootstrap modals中使用summernote时遇到了同样的问题。当我想添加图片/视频/链接时,summernote模态会出现在父模态的后面。这就是我解决问题的方式。
gywdnpxw7#
我有同样的错误,这是我如何解决它,它的工作正常