jQuery對話框中的wysiwyg編輯器不起作用

編輯器爲一個網站。我測試了一些（tinyEditor，wysihtml5，jHTMLArea ...）。當我在我的網站上只有一個textarea元素時，它就可以工作。但是，當我創建一個jQuery對話框，並希望把編輯器在它不工作。我看到所有的圖標和按鈕，但我不能在編輯器中寫入文本。問題總是一樣的。我正在使用jQuery 1.10.2。有沒有人有同樣的問題或者解決方案？jQuery對話框中的wysiwyg編輯器不起作用

（我測試了我在Chrome和Firefox網站）

這裏是一些代碼（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 -->

來源

2014-09-03 Lee

請出示你的HTML/CSS，甚至表現出你的問題的jsfiddle.net。 – 2014-09-03 12:13:55

http://jsfiddle.net/fNPvf/7578/ – Lee 2014-09-03 12:36:36

你只需要實例化編輯器一旦文本區域變得可見。在您的代碼中，您在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/

來源

2014-09-03 13:55:04

啊，這幫助我解決這個問題！謝謝！ – MrD 2015-06-18 09:16:22

jQuery對話框中的wysiwyg編輯器不起作用

回答

相關問題