Froala编辑器崩溃

Question

在复制粘贴文本以及其他一些情况时，它会崩溃。此后无法提交表单。

这是我与图片上传器一起使用的JavaScript参数：

require('froala-editor/js/froala_editor.pkgd.min');

$(function () {
    'use strict';

    $('.editor').froalaEditor({
        htmlAllowedEmptyTags: ['footnote'],
        heightMin: 400,
        // Set the language code.
        language: 'ru',
        imageUploadParam: 'image_param',
        imageUploadParams: {id: 'my_editor'},
        imageUploadURL: '/admin/froala/upload-image',
        imageUploadMethod: 'POST',
        imageAllowedTypes: ['jpeg', 'jpg', 'png'],
        requestHeaders: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    })
      

});

和html：

 <div class="col-sm-6">
     <div class="form-group">
        <label for="description">Description</label>
         <textarea class="editor" rows="10" name="description" id="description" required>{{ old('description') }}</textarea>
     </div>
</div>

Answer 1

我也遇到了您的问题，今天我有一个解决方法。

您可以参考my answer for my question on StackOverflow here

我想您已经使用CSS隐藏了Froala的无牌标语，因此在更改模型11次后，它将崩溃。这是我检测问题的简单演示  https://stackblitz.com/edit/react-froala-editor?file=style.css。

div.fr-wrapper>div>a {
        /* display: none !important; */
        /* position: fixed; */
        /* z-index: -99999 !important; */
    font-size: 0px !important;
    padding: 0px !important;
    height: 0px !important;
}

在CSS代码中，如果我们使用display: none，则第11次更改后它将崩溃。您可以尝试使用display: none，在编辑后它将崩溃11次。

我找到了解决此问题的技巧，我没有隐藏横幅，但是我将上面的代码设置为font-size: 0和padding: 0不可见。

Answer 2

看来你隐藏了许可红色div

为了修复此错误，只需将以下样式添加到您的代码中

a[href='https://www.froala.com/wysiwyg-editor?k=u'] {
        font-size: 0px !important;
        padding: 0px !important;
        height: 0px !important;
}