Wasserzeichentext in CKEditor
-
28-10-2019 - |
Frage
Wissen Sie, wie Sie in CKEditor (visuelles Textverarbeitungsprogramm) Wasserzeichen hinzufügen? Ich möchte das Verhalten wie folgt: Wenn der CKEditor geladen wird, enthält er standardmäßig Text.Wenn ich darauf klicke, muss der Text verschwinden.
Lösung
Nachfolgend finden Sie die Schritte zum Hinzufügen eines Wasserzeichens in CKEditor
Im Allgemeinen, wenn Sie beim Laden der Seite den Standardtext im Ck-Editor über ein Java-Skript festlegen.Das JavaScript-Ereignis wird ausgelöst, bevor das Steuerelement tatsächlich geladen wird. Legen Sie daher nach Möglichkeit den Text für den Code dahinter fest.
Anhängen von Ereignissen in Javascript für OnFocus und OnBlur
$(document).ready(function() {
var myeditor = CKEDITOR.instances['EditorId'];
myeditor.on("focus", function(e) {
RemoveDefaultText();
});
myeditor.on("blur", function(e) {
setDefaultText();
});
});
Definieren Sie Ihren Standardtext in dieser Funktion
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();
}
}
Sie können dem Wasserzeichen auch Stile definieren, indem Sie dem Standardtext Klassen hinzufügen und die Klasse in den css des ck-Editor-Inhalts einfügen, da dies sonst nicht funktioniert.
Andere Tipps
Vielleicht möchten Sie dieses jQuery-Plugin ausprobieren: