我有一个项目,在其中我使用一个模态与一个表单和一个ckeditor和链接输入不工作。
这里有一个小提琴,重现了这个问题:
http://jsfiddle.net/8t882a2s/3/
和这个例子的代码。
超文本标记语言:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" contenteditable="true" id="myModalLabel">Modal title</h4>
</div>
<div id="bodyModal" contenteditable="true" class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<button type="button" class="btn btn-default navbar-btn margin-right-button-nav" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-new-window"></span> Edit Modal</button>
字符串
JS:
CKEDITOR.disableAutoInline = true;
$(document).ready(function() {
$('#myModal').on('shown.bs.modal', function () {
CKEDITOR.inline('myModalLabel');
CKEDITOR.inline('bodyModal');
})
});
型
这并不是我的代码,但bug是一样的。如果你点击模态,然后尝试添加一个链接,你不能在输入字段中写入网址。
谢谢您的支持:)
4条答案
按热度按时间wbrvyc0a1#
互联网上的很多答案建议了多种修复方法,这对我来说很有效,对于bootstrap 4项目:
字符串
如果你运行在bootstrap 3上,那么覆盖
$.fn.modal.Constructor.prototype.enforceFocus
insdead。dkqlctbz2#
要解决这个问题,做好以下几点就足够了:
1.在body标签上添加自定义css规则
第一个月
$( '#basicModal' ).modal( { focus: false } );
个<div class="modal fade " data-focus="false" id="basicModal">
db2dz4w83#
对我来说,从模态属性中删除
tabindex="-1"
解决了这个问题。kt06eoxx4#
没错!对我来说,data-focus=“false”解决了所有问题