添付テキストエリアを編集できないのはなぜですか？

Question

divにテキストエリアを追加しようとしています。テキストエリアが追加されると、ブラウザウィンドウのサイズを変更するまで入力を開始できません。どのようにして最初に選択可能にすることができますか？

<script> 
$("#distraction-mode").click(function(e){ // Entering the distraction mode 
     e.preventDefault(); 
    $("#wysiwyg").appendTo("#wysiwyg-fullscreen"); 
}); 
</script> 

<div id="wysiwyg-fullscreen-container"> 
    <div id="wysiwyg-fullscreen"></div> <!-- div where textarea will be --> 
</div> 

<div id="wysiwyg"> 
    <textarea id="editor" name="editor" rows="" cols=""></textarea> 
    <a href="#" id="distraction-mode">Distraction Mode</a> 
</div> 

Answer 1

推測でいますが、テキストエリアに.refresh()、その後、.focus()を呼び出すことができます。

これは、あなたがそれにアクセスできるように変数にエディタが設定されているために、特にその上の関数を呼び出すことができるようにする必要がありますドキュメントhere

EDIT
に基づいています。別の要素に追加した後にrefresh()とfocus()を使用すると、その要素のサイズ変更とリセットが可能になります。

それはこのようなものになります。

<script> 
var editor = $("#editor").cleditor()[0]; 

$("#distraction-mode").click(function(e){ 
    // Entering the distraction mode 
    e.preventDefault(); 
    $("#wysiwyg").appendTo("#wysiwyg-fullscreen"); 
    editor.refresh(); 
    editor.focus(); 
}); 
</script>