jQuery Cleditor在關鍵字上獲取textarea值

我使用Cleditor http://premiumsoftware.net/cleditor/docs/GettingStarted.html。我想獲得keyup的值並將文本插入另一個div。 cleditor自帶change（）事件，我目前在下面的jsfiddle例子中使用，但那與keyup不一樣。我想要在輸入時更新div。我嘗試了keyup，但它不起作用。jQuery Cleditor在關鍵字上獲取textarea值

這裏就是我現在

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

檢查的jsfiddle http://jsfiddle.net/qm4G6/11/

來源

2011-10-15 Pinkie

看來，cleditor隱藏textarea並與iframe替換它（見cleditor源線203）。

因此，要達到你想要什麼，你只需要訪問生成iframe內容：

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

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

Updated jsFiddle

更新來解決Tim的評論

這個工作在Chrome和Firefox （我沒有訪問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

用戶ima007能夠找到一個更好的跨瀏覽器的解決方案：jQuery Cleditor wysiwyg text editor: keyup() works in webkit browsers but not Firefox or IE

來源

2011-10-16 15:07:53 dgilland

這小提琴解決方案適用於WebKit瀏覽器，Chrome和Safari，但不是在Firefox或IE瀏覽器，我一直沒能弄明白，但我想，如果有人可以提供一個代碼修復這2個瀏覽器？謝謝你，-tim peterson –

我在這裏回答了你的後續問題：http://stackoverflow.com/questions/7864012/jquery-cleditor-wysiwyg-text-editor-keyup-works-in-webkit-browsers-but-not-科幻 – dgilland

我能夠通過稍微修改編輯器的源代碼，以實現此 - in refresh方法（第801行）我修改了iframe doc的blur事件處理程序。

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

修改到

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

，並在在初始化時傳遞的選項，你可以定義

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

希望這有助於任何人。

Regards

來源

2012-03-21 06:19:04 saarthak

您是否嘗試過使用CLEditor'.doc'屬性？

doc - 當前正在iframe中編輯的文檔對象。 cleditor documentation

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

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

來源

2014-01-23 08:58:34 perlexed

jQuery Cleditor在關鍵字上獲取textarea值

回答

相關問題