Question

网站编辑。我测试了一些（tinyEditor，wysihtml5，jHTMLArea ......）。当我在我的网站上只有一个textarea元素时，它可以工作。但是当我创建一个jQuery对话框并希望将编辑器放入其中时它无法正常工作。我看到所有图标和按钮，但我无法将文本写入编辑器。问题总是一样的。我正在使用jQuery 1.10.2。有没有人有同样的问题或者可能有解决方案？

（我用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 -->

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/

jquery对话框中的wysiwyg-editor无法正常工作

1 个答案: