Watermerk-tekst in CKEditor

Weet jij hoe je een watermerk kunt toevoegen in CKEditor (visuele tekstverwerker)? Ik wil het gedrag als volgt: wanneer de CKEditor is geladen, heeft deze standaard tekst. Als ik erop klik, moet de tekst verdwijnen.

0

3 antwoord

Hieronder vindt u de stappen voor het toevoegen van watermerken in CKEditor

Over het algemeen wanneer u standaardtekst instelt in Ck Editor via java-script bij het laden van de pagina. JavaScript-gebeurtenis wordt geactiveerd voordat het besturingselement daadwerkelijk wordt geladen, dus stel indien mogelijk de tekst voor code achter.

Evenementen toevoegen in Javascript voor OnFocus en OnBlur

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

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

Definieer uw standaardtekst in deze functie

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();
   }
}

U kunt ook stijlen definiƫren voor de watermerkmarkering door klassen toe te voegen aan de standaardtekst en de klasse in u te plaatsen ck-editorinhoud css, anders werkt het niet

1
toegevoegd
Zoals ik uitgelegd heb in alfonsoml.blogspot.com.es/ 2012/04/& hellip; , is het probleem met deze basisaanpak dat het niet correct zal werken met de dialoogvensters en dat de tekst van de tijdelijke aanduiding kan worden verzonden als de gebruiker het formulier verzendt.
toegevoegd de auteur AlfonsoML, de bron

Een kant-en-klare plug-in kan hier worden getest . Hiermee kan de standaardtekst worden aangepast en wordt rekening gehouden met dialoogvensters en de gegevens van een extern script.

0
toegevoegd

Misschien wil je deze jQuery-plug-in eens proberen:

https://github.com/antoineleclair/ckwatermark

0
toegevoegd