jquery 대화 상자의 wysiwyg 편집기가 작동하지 않습니다.

Question

웹 사이트 용 편집기. 나는 (tinyEditor, wysihtml5, jHTMLArea ...) 몇 가지를 테스트했다. 내 사이트에 textarea 요소 만 있으면 작동합니다. 하지만 jQuery 대화 상자를 만들고 편집기를 넣을 때 작동하지 않습니다. 모든 아이콘과 버튼을 볼 수 있지만 편집기에 텍스트를 쓸 수 없습니다. 문제는 항상 동일합니다. 나는 jQuery 1.10.2를 사용하고있다. 누구나 같은 문제가 있거나 해결책이 있습니까?

여기

(I 크롬과 파이어 폭스에서 내 웹 사이트를 테스트) 일부 코드 (jHtmlArea) :

$('#dialogEditor').htmlarea({css: "/static/css/jHtmlArea.Editor.css"});//init 

$(function() { 
     $("#dialog").dialog({ 
      width: 420, autoOpen: false, 
      open: function (evt, ui) { 
       $("#dialogEditor").htmlarea(); 
      } 
     }); 

    }); 


function openDialog() 
{ 
    $('#dialog').dialog('open'); //open dialog 
} 

HTML 코드 : 당신은 편집기를 인스턴스화 할 필요가

<!-- Dialog Beginn --> 
<div id="dialog" title="Studie" > 
    <center> 
     <textarea id="dialogEditor" rows="10" style="width: 400px"></textarea> 
    </center> 
</div> 
<!-- Dialog End --> 

Answer 1

일단 텍스트 영역이 보이게되면 코드에서 dialog을 열기 전에 코드를 인스턴스화합니다. 그것을 주석 처리하면 효과가 있습니다.

function openDialog() { 
    //$('#dialogEditor').htmlarea(); <-- Comment out this 
    //$.ui.dialog.defaults.bgiframe = true; 
    $(function() { 
     $("#dialog").dialog({ 
      width: 420, 
      autoOpen: false, 
      open: function (evt, ui) { 
       $("#dialogEditor").htmlarea(); 
      } 
     }); 

    }); 
    $('#dialog').dialog('open'); 
} 

http://jsfiddle.net/fNPvf/7585/