JQuery Cleditor obtient une valeur textarea sur la clé

J'utilise Cleditor http://premiumsoftware.net/cleditor/docs/GettingStarted.html . Je veux obtenir la valeur sur la touche et insérer le texte dans une autre div. Cleditor vient avec l'événement change () que j'utilise actuellement dans l'exemple jsfiddle ci-dessous, mais ce n'est pas la même chose que keyup. Je veux que le div soit mis à jour au fur et à mesure que je tape. J'ai essayé la clé mais ça ne fonctionne pas.

Voici ce que j'ai maintenant

$("#input").cleditor().change(function(){ var v = $('#input').val(); $('#x').html(v); })

Vérifiez jsfiddle http://jsfiddle.net/qm4G6/11/

Il semble que cleditor masque la zone de textarea et la remplace par un iframe (voir la ligne 203 de la source Cleditor).

Donc, pour atteindre ce que vous voulez, il vous suffit d'accéder au contenu iframe résultant:

 $("#input").cleditor(); $(".cleditorMain iframe").contents().find('body').bind('keyup', function(){ var v = $(this).text(); // or .html() if desired $('#x').html(v); });

Mise à jour jsFiddle

MISE À JOUR pour aborder le commentaire de Tim

Cela fonctionne dans Chrome et Firefox (je n'ai pas accès à IE):

 $("#input").cleditor(); $( $(".cleditorMain iframe")[0].contentWindow.document ).bind('keyup', function(){ var v = $(this).text(); // or .html() if desired $('#x').html(v); });

Mise à jour jsFiddle

MISE À JOUR 2

L'utilisateur ima007 a pu trouver une meilleure solution de navigateur croisé: jQuery Cleditor wysiwyg éditeur de texte: keyup () fonctionne dans les navigateurs Web, mais pas Firefox ou IE

J'ai été en mesure d'y parvenir en modifiant légèrement le code source de l'éditeur – en méthode de refresh (ligne 801) J'ai modifié le gestionnaire d'événements flou de iframe doc.

 // Update the textarea when the iframe loses focus ($.browser.mozilla ? $doc : $(contentWindow)).blur(function() { updateTextArea(editor, true); });

Modifié à

 // Update the textarea when the iframe loses focus or keyup happens ($.browser.mozilla ? $doc : $(contentWindow)).bind('blur keyup', function (e) { updateTextArea(editor, true); if (options.keyup && e.type === 'keyup') options.keyup(editor.$area.val()); });

Et dans les options qui sont passées au moment de l'initialisation, vous pouvez définir

 $("#element").cleditor({ keyup : function (text) { alert(text); // do something } });

J'espère que cela vous aidera.

Cordialement

Avez-vous essayé d'utiliser la propriété '.doc' de CLEditor?

Doc – L'objet du document actuellement en cours d'édition dans l'iframe. Documentation du cédant

 var inputDoc = $("#input").cleditor().doc; $(inputDoc).keyup(function(){ var v = $('#input').val(); $('#x').html(v); })