使文本区域像 CKEditor

Make textarea like CKEditor

如何制作像 CKEditor 一样的简单文本区域?比如按回车会自动换行或者按TAB会空格等等?因为我将 CKEditor 添加到我的项目中,但是当我将其清空时,它不会在 codeigniter3 中给出验证错误。实际上,它给出了错误,但在得到错误之前我还应该清空其他字段,但是当我删除 CKEditor 时它工作正常。

创建像CKEditor这样的textarea太费劲了。如果您对 validation 有疑问,因为它默认添加几个 html tags,在这种情况下,这是一个技巧。这将帮助您继续使用 CKEditor。

默认情况下,您需要在源代码模式下加载 CKEditor,如下所述。

function () {
    // set the startup mode
    CKEDITOR.config.startupMode = 'source';
    CKEDITOR.replace('editor1');
}

这对你有帮助。如果它不起作用,请告诉我。

// set the startup mode 
CKEDITOR.config.startupMode = 'source'; 
CKEDITOR.replace('insdescription1'); 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-12 input-group" > 
<textarea type="text" id="insdescription1" name="insdescription1" class=" form-control" rows="5" placeholder="Description"></textarea> 
</div> 

<script src="https://cdn.ckeditor.com/4.7.1/standard/ckeditor.js"></script>

我认为最简单的方法是您可以使用 tinymce。它会工作得很好,而且占用空间很小。这是例子。 只需在需要文本编辑器的任何地方应用此代码。

<!DOCTYPE html>
<html>
<head>
  <script src="https://cloud.tinymce.com/stable/tinymce.min.js"></script>
  <script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
  <textarea>Your text</textarea>
</body>
</html>

我找到了如何修复错误。您需要将此代码粘贴到页面顶部。

<script type="text/javascript">
CKEDITOR.on('instanceReady', function()
{
    $.each( CKEDITOR.instances, function(instance) 
    {
        CKEDITOR.instances[instance].on("change",function(e) 
        {               
            for ( instance in CKEDITOR.instances)
            CKEDITOR.instances[instance].updateElement();
        });
    });
});
</script>