jQuery Cleditor ottiene valore textarea su keyup

Question

Sto usando Cleditor http://premiumsoftware.net/cleditor/docs/GettingStarted.html. Voglio ottenere il valore su keyup e inserire il testo in un altro div. cleditor viene fornito con change() evento che sto attualmente usando nell'esempio jsfiddle di seguito, ma questo non è lo stesso di keyup. Voglio che il div sia aggiornato mentre sto digitando. Ho provato il keyup ma non funziona.

Ecco quello che ho adesso

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

check jsfiddle http://jsfiddle.net/qm4G6/11/

Answer 1

Sembra che cleditor nasconde la textarea e lo sostituisce con un iframe (vedere la linea 203 di fonte cleditor).

Quindi, per ottenere quello che vuoi, non vi resta che accedere alle conseguenti iframe contenuti:

$("#input").cleditor(); 

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

Updated jsFiddle

aggiornamento per risolvere il commento di Tim

Questo funziona in Chrome e Firefox (Non ho accesso a IE):

$("#input").cleditor(); 

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

Updated jsFiddle

UPDATE 2

utente ima007 è stato in grado di trovare una soluzione migliore cross-browser: jQuery Cleditor wysiwyg text editor: keyup() works in webkit browsers but not Firefox or IE

Answer 2

sono stato in grado di raggiungere questo obiettivo modificando leggermente il codice sorgente del redattore - nel metodo refresh (riga 801) Ho modificato il gestore di eventi sfocatura del documento iframe.

Precedente

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

modificato per

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

e nelle opzioni che vengono passate al momento della inizializzazione, è possibile definire

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

Spero che questo aiuti chiunque.

saluti

Answer 3

Hai provato a usare di CLEditor 'doc' immobile?

doc - L'oggetto documento attualmente in fase di modifica nell'iframe. cleditor documentation

var inputDoc = $("#input").cleditor().doc; 

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