bootstrap的模态弹窗和CKEditor的模态弹窗冲突问题解决

bootstrap的模态弹窗和CKEditor的模态弹窗，使用时。会造成编辑器的弹出框中的文本框不能编辑。

解决办法：

在页面中添加一段代码即可：

$.fn.modal.Constructor.prototype.enforceFocus = function () {
            modal_this = this
            $(document).on(‘focusin.modal‘, function (e) {
                if (modal_this.$element[0] !== e.target && !modal_this.$element.has(e.target).length
                &&
                !$(e.target.parentNode).hasClass(‘cke_dialog_ui_input_select‘) && !$(e.target.parentNode).hasClass(‘cke_dialog_ui_input_text‘)) {
                    modal_this.$element.focus()
                }
            })
        };

2014-06-13

bootstrap的模态弹窗和CKEditor的模态弹窗冲突问题解决,布布扣,bubuko.com

时间： 2024-10-25 15:30:24

bootstrap的模态弹窗和CKEditor的模态弹窗冲突问题解决的相关文章

bootstrap 嵌套模态框二级模态框关闭导致一级模态框滚动条消失

一.问题描述实际开发中遇到bootstrap嵌套模态框,关闭次模态框后主模态框滚动条消失. 二.解决办法在主模态框上加属性:(先凑合着用,回头再看看源码) style="overflow-y: auto;" 问题:在使用Bootstrap时,有时候会用到模态框中再嵌套模态框.这样就会出现一个问题,就是在关闭第二个模态框时,会导致第一个模态框的滚动条消失,这样就会使得屏幕太小而模态框太大看不到底部信息,而没法进行操作. 解决方法:就是在第二个模态框的关闭hide 方法调用之后立即触发

Bootstrap model模态框与百度地图API发生冲突时的解决办法

在使用百度地图API的过程中,当我需要在infoWindow的按钮点击触发modal模态框时,就会发现bootstrap的模态框会失效.弄清modal的原理就可以通过自定义modal的css样式和modal方法来解决这个问题.Bootstrap modal模态框的原理是通过控制modal框div的visibility属性来变化来实现的,在初始状态modal div的visibility属性值为hidden,在页面上隐藏,当点击按钮触发(或别的事件)一个方法使div的visibility值变为vi

模态框与天地图地图控件冲突

界面采用bootstrap, 弹出模态框时,天地图的地图控件却悬浮在模态框之上,并可以继续响应操作,如图所示: 没有找出较好的解决方法,最后通过在显示模态框时将地图控件隐藏,不显示模态框时再显示地图控件的方法实现. 示例代码如下: $("#modalId").on("show.bs.modal", function () { control1.hidden(); control2.hidden(); filterControl.hidden(); }); $(&qu

jQuery点击弹出层，弹出模态框，点击模态框消失

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 <!DOCTYPE html>

FormSheet式模态视图，点击模态视图外隐藏模态视图的方法

#pragma -mark 点击模态视图外的空白处隐藏模态视图 - (void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated]; _tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTapBehind:)]; [_tapRecognizer setNumberOfTapsRequired:1

bootstrap 的modal中popover操作时，弹窗中的输入框，按钮不能聚焦

本地894行 Modal.prototype.enforceFocus = function () { $(document) .off('focusin.bs.modal') // guard against infinite focus loop .on('focusin.bs.modal', $.proxy(function (e) { if ($(e.target).parents('.popover').length > 0) return;//mod by xss modal上pop

微信小程序自定义弹窗wcPop插件|仿微信弹窗样式

微信小程序自定义组件弹窗wcPop|小程序消息提示框|toast自定义模板弹窗平时在开发小程序的时候,弹窗应用场景还是蛮广泛的,但是微信官方提供的弹窗比较有局限性,不能自定义修改.这个时候首先想到的是自定义组件化开发,就是把弹出框封装成一个组件,然后多处调用. 解决了小程序开发自定义弹窗出现后,遮罩层下的页面仍可以滚动的方法: 给遮罩层的最外层view中加入catchtouchmove="preventTouchMove" 即可解决该遮罩层点透问题. 根据需要还可以自定义多个按钮及事

[jquery] 遮罩弹窗，点击遮罩弹窗自动隐藏

$("#id_sign_forbidden_win .c-content").click(function(event){ event.stopPropagation(); // 阻止点击事件的冒泡 }); $("#id_sign_forbidden_win").bind("click" , function(eventBody){ $("#id_sign_forbidden_win").hide(); });

第二百四十三节，Bootstrap模态框插件

Bootstrap模态框插件学习要点: 1.基本使用 2.用法说明本节课我们主要学习一下 Bootstrap 中的模态框插件,这是一款交互式网站非常常见的弹窗功能插件. 一．基本使用使用模态框的弹窗组件需要三层 div 容器元素: 1分别为 modal(模态声明层). 2dialog(窗口声明层). 3content(内容层). 在内容层里面,还有三层: 1分别为 header(头部). 2body(主体). 3footer(注脚). modal样式class类,写在声明模态框<div

bootstrap的模态弹窗 和CKEditor的模态弹窗冲突问题解决

bootstrap的模态弹窗 和CKEditor的模态弹窗冲突问题解决的相关文章

bootstrap的模态弹窗和CKEditor的模态弹窗冲突问题解决

bootstrap的模态弹窗和CKEditor的模态弹窗冲突问题解决的相关文章