时间戳

首页 > 解决方案 > 以模态显示后无法在ckeditor中输入任何文本

angularjs - 以模态显示后无法在ckeditor中输入任何文本

问题描述

我在模式中单击按钮时显示 ckeditor，以便用户在其中输入数据，但有时在显示 ckeditor 后，用户无法在文本框中输入任何内容。

这是 HTML 代码：

<input type="button" class="btn" id="addsubcatpost" value="Add new post" ng-click="showsubcatpost()">

<textarea name="subcateditor" ng-model="cat_postcontent" id="subcateditor" rows="10" cols="80">{{postcontent}}</textarea>

<script>
    CKEDITOR.replace('subcateditor', {
        toolbarGroups: [
            {"name": "styles", "groups": ["styles"]},
            {"name": "paragraph", "groups": ["list", "align"]},
            {"name": "basicstyles", "groups": ["basicstyles"]},
            {"name": 'insert', "groups": ['addImage']}
        ],
        removeButtons: 'Underline,Strike,Subscript,Superscript,Anchor,Styles,Specialchar,Format,Image,Flash,Table,HorizontalRule,Smiley,SpecialChar,PageBreak,Iframe,addFile',                                                filebrowserUploadUrl: '/admin/categorymanagement/uploadckeditorimages'
    });
</script>

这是js文件：

$scope.showsubcatpost = function() {
  $scope.cat_title = '';
  CKEDITOR.instances['subcateditor'].setData('');
  $(".urlinks").val('');
  $(".selector-wrapper").html('');
  $(".attached-files").hide();
  $('.image-attachment-preview').html('');
  $('.document-attachment-preview').html('');
  $('.weblink-attachment-preview').html('');
  $('.gdocs-attachment-preview').html('');
  $('.video-attachment-preview').html('');
  $("#addnewsubcatpost").toggle();
  $(".hidediv").hide();
};

模态的屏幕截图

模态的屏幕截图。

标签： angularjsckeditor

解决方案

从模态容器中删除tabindex属性对我有用。

https://github.com/twbs/bootstrap/issues/6996

推荐阅读