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编辑器不起作用

回答

相关问题