【问题标题】：Ckeditor change widthckeditor 改变宽度
【发布时间】：2011-12-17 02:32:15
【问题描述】：

我想更改 Ckeditor 的宽度和高度，但无法更改。请知道我想在调用 CKeditor 时对其进行更改，我不想在 config.js 中对其进行硬编码...

底部代码不起作用，您有什么建议？

var editor = CKEDITOR.replace('editorToday',
          {


            toolbar :
                [
                    { name: 'document', items : [ 'Preview' ] },
                    { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
                    { name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','Scayt' ] },
                    { name: 'insert', items : [ 'Image','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'] },
                            '/',
                    { name: 'styles', items : [ 'Styles','Format' ] },
                    { name: 'basicstyles', items : [ 'Bold','Italic','Strike','-','RemoveFormat' ] },
                    { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote' ] },
                    { name: 'links', items : [ 'Link','Unlink','Anchor' ] },
                    { name: 'tools', items : [ 'Maximize','-','About' ] }

                ]

            });


CKEDITOR.instances.editor.resize(500, 400);

【问题讨论】：

试试CKEDITOR.config.width = 200，正如@user3258189在下面建议的那样——这是在谷歌搜索数小时后对我有用的唯一东西。

标签： ckeditor

【解决方案1】：

试试这个：

 var editor = CKEDITOR.replace('editorToday',
      {


        toolbar :
            [
                { name: 'document', items : [ 'Preview' ] },
                { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
                { name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','Scayt' ] },
                { name: 'insert', items : [ 'Image','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'] },
                        '/',
                { name: 'styles', items : [ 'Styles','Format' ] },
                { name: 'basicstyles', items : [ 'Bold','Italic','Strike','-','RemoveFormat' ] },
                { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote' ] },
                { name: 'links', items : [ 'Link','Unlink','Anchor' ] },
                { name: 'tools', items : [ 'Maximize','-','About' ] }

            ],
        width: "400px",
        height: "500px"

        });

【讨论】：

只是补充一下，代码很可能失败，因为 CKE 加载是异步的。这意味着当 .resize(...) 被调用时 CKEditor 尚未加载，因此它无法自行调整大小。

【解决方案2】：

以下内容取自How to change or set width of Ckediotr TextBox area using ASP .Net。

步骤1

创建一个新的 ASP.NET 网站并将其命名为 Demo_application。

第 2 步

从这里下载 Ckeditor 并将 Ckeditor 添加到应用程序的根文件夹中。

第三步

在您的 .aspx 页面中调用 Ckeditor 脚本，如下所示

<script type="text/javascript" src="scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckeditor/adapters/jquery.js"></script>

第四步

将 Ckeditor TextBox 添加到您的 .aspx 文件中，id 为 txtCkEditor

<asp:TextBox ID="txtCkEditor" runat="server" TextMode="MultiLine"></asp:TextBox>

第 5 步。

调用Below JavaScript函数改变Ckeditor TextBox区域的默认宽度。

<script type="text/javascript">
    $(function () {  
      CKEDITOR.replace('<%=txtCkEditor.ClientID %>');
      CKEDITOR.config.width = 200;
    });
</script>

第 6 步

测试您的应用程序。

【讨论】：

不鼓励依赖链接的答案，您可以总结答案并留下链接作为参考吗？
与两年多前提供的简单答案相比，这太复杂了。
实际上，在尝试了很多东西之后，CKEDITOR.config.width = 200 是唯一对我有用的东西，谢谢！

【解决方案3】：

我建议使用括号表示法以及使用实例的 ID：

尝试使用

CKEDITOR.instances['editorToday'].resize(500, 400);

【讨论】：

我尝试了你的代码，但是如果我打开 firebug 来检查错误，它没有工作，页面停留在“加载”状态...
页面中的某些内容尚未加载，这可能会阻止 js 正常执行。我尝试了您的代码，但改为使用它，它工作正常：CKEDITOR.instances.editorToday.resize(500, 400);

【解决方案4】：

只需使用这个：

CKEDITOR.replace('descCKEditor',{ width: "800px",height: "500px"});

【讨论】：