Redactorエディタの複数のインスタンスが動作していません

Question

私のHTMLエディタに「redactor」（http://imperavi.com/redactor）を使用しています。 1つのページに複数のエディタがある場合、IDを使用して各エディタを使用して初期化すると、これは完全に機能しています。しかし、クラスを使って初期化すると、最初のクラスは完全にしか動作しません。この

$(".htmlEditor").redactor(); 

最初のエディタの動作を初期化するために、次のコードを使用して

イム。 2ndまたは他のエディタのフォーマットボタンを押すと、フォーカスが最初のエディタにジャンプします。

IDを使用して各エディターを個別に初期化すると、すべてのエディターが機能しています。

しかし、編集者がページに動的に追加されるので、私はクラスを使いたいと思っていました。

私は他のjqueryプラグインを使用しています（クラスを使用して1ページに複数のインスタンスを初期化しています）、このプラグインでこれを行う方法があるはずです。

私には何かが欠けていますか？または私は任意の設定を行う必要がありますか？

Answer 1

は次のようになめらかを使用してみてください：

$(".htmlEditor").each(function() { 
    $(this).redactor(); 
}); 

Answer 2

あなたが個別に各エディタを初期化する必要があります。 $(".htmlEditor").redactor();を使用すると、DOMツリー内に既に初期化されたエディタであるすべてのエディタが選択されているため、複数の初期化の問題が発生します。エディタを動的に追加したいと言っているので、新しいエディタをIDなしで別々に初期化する必要があります。これを行うには、最新の動的に追加されたエディタDOMオブジェクトを取得し、jqueryを使用してそれを初期化する必要があります。 Javascriptを

$('#add-editor').on('click', function() { 
    var new_editor_text = "<h2>Hello and welcome</h2>" + 
     "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>"; 

    var $editor = $('<textarea/>', { 'class': 'redactor-editor', text: new_editor_text }); 

    $('#editors').append($editor); 
    $editor.redactor(); 
}); 

を

HTML

<div id="editors"></div> 

<button id="add-editor">Add New Editor</button> 

：私は新しいエディタを追加し、それを、それはクリックを取得するたびに初期化ボタンを持つ単純な例を書いてきましたテストすることができ、それが動作しているのを見ることができる私の実例です：http://zikro.gr/dbg/html/redactor/

そして、ここでそれが働いているかを示すことのスクリーンキャプチャです：

Answer 3

この

for redactor in $(document).find("textarea.editor") 

     $(redactor).redactor()