Question

您知道如何在CKEditor（可视文字处理器）中添加水印吗？我想要这样的行为：当加载CKEditor时，默认情况下它有文本。当我点击它时，文字必须消失。

Answer 1

以下是在CKEditor中添加水印的步骤

通常在页面加载时通过java脚本在Ck编辑器中设置默认文本。在控件实际加载之前会触发JavaScript事件，因此如果可能的话，为后面的代码设置文本。

在Javascript中为OnFocus和OnBlur附加事件

$(document).ready(function() {
    var myeditor = CKEDITOR.instances['EditorId'];

    myeditor.on("focus", function(e) {
        RemoveDefaultText();
    }); 
    myeditor.on("blur", function(e) {
        setDefaultText();
    });
});

在此功能中定义默认文本

function setDefaultText() {
    if (CKEDITOR.instances['EditorId'].getData() == '') {
        CKEDITOR.instances['EditorId'].setData('Your Message Here'); 
    }
}

function RemoveDefaultText() {
   if (CKEDITOR.instances['EditorId'].getData().indexOf('Your Mesage Here') >= 0) {
       CKEDITOR.instances['EditorId'].setData('');
       CKEDITOR.instances['EditorId'].focus();
   }
}

你也可以通过在默认文本中添加类来定义水印的样式，并将类放入ck编辑器内容css中，否则它将无效

Answer 2

可以测试即用型插件here。它允许自定义默认文本，它可以进入帐户，对话框以及从外部脚本读取数据。

Answer 3

您可能想尝试这个jQuery插件：

https://github.com/antoineleclair/ckwatermark

CKEditor中的水印文本

3 个答案: