如何使 dijit/编辑器手动调整大小？答案

【问题标题】：How to make a dijit/editor manualy resizable?如何使 dijit/编辑器手动调整大小？
【发布时间】：2015-07-14 22:48:44
【问题描述】：

我正在尝试制作一个位于对话框中的富文本编辑器，可以手动调整大小（使用鼠标）。有什么dojo小部件可以实现吗？

这是我的代码：

<div data-dojo-type="dijit/Dialog" data-dojo-id="myFormDialog" title="Editor">
  <div class="dijitDialogPaneContentArea" data-dojo-attach-point="name">
    <label id="editorLabel" for="name"><b>Insert your explanation below: </b></label>
    <input id="editorInput" type="hidden" name="editorContent" data-dojo-attach-point="name" style="display:none" />
    <div id="editorContent" dojoType="dijit/Editor" height="200px" extraPlugins=" ['createLink', 'unlink', 'insertImage'] "></div>
  </div>
</div>
<button id="editorButton" data-dojo-type="dijit/form/Button" type="button" iconClass="dijitNoIcon" onclick="myFormDialog.show()" height="">Show Editor</button>

【问题讨论】：

标签： javascript dojo editor resizable

【解决方案1】：

我没有找到 dojo 小部件，但在 css 文件中添加这一行就像一个魅力：

.claro .dijitEditorIFrame{ resize:both; }

【讨论】：

【解决方案2】：

使用以下 CSS，在您的 textarea 上强制执行 resize。

textarea {
    resize: both !important;
}

实时示例： https://jsfiddle.net/esrcju2p/7/

您可以在此处阅读有关resize 属性的更多信息：http://www.w3schools.com/cssref/css3_pr_resize.asp

require(["dijit/form/Textarea", "dojo/domReady!"], function(Textarea){
    var textarea = new Textarea({
    style: "resize:both",
        name: "myarea",
        value: "Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.",
        style: "width:200px;"
    }, "myarea").startup();
});

【讨论】：