Question

我已将可编辑的类添加到我的f.text_area，然后调用该类的编辑器。我想修改我的文本区域的高度(row=10)，当我给它编辑可用的类时，它不起作用有人可以帮我弄这个吗？或建议另一个编辑器，如中型编辑器，但可以设置text_area的样式？

我的代码：

    <%= f.text_area :story, :class => 'form-control', rows: 10 , id:'editable' %>

脚本：

    var elements = document.querySelectorAll('#editable'),
editor = new MediumEditor(elements, {
});

Answer 1

您可以在元素之后传递该哈希中的媒体编辑器样式选项。请在此处查看有关如何设置样式的详细信息：https://github.com/yabwe/medium-editor#mediumeditor-options

Answer 2

当您将<textarea>元素传递给MediumEditor时，它会隐藏<textarea>并创建一个<div contenteditable="true">，它将是可编辑的，并且就像WYSIWYG编辑器一样，因此您可以将格式设置为你打字（即粗体，斜体，下划线，子弹等）。 MediumEditor将监控<div>是否有任何更改，并确保它们与隐藏的<textarea>同步。

当隐藏<textarea>并插入<div>时，它会将<textarea>中的大部分属性复制到<div>。因此，如果您将一个类名添加到textarea（即<textarea class="editor">），该类将被复制到创建的<div>中。

然后，您可以根据需要设置编辑器的样式：

div.editor {
    line-height: 12px;
    height: 120px;
}

通常情况下，<div>会在用户输入时自动调整大小，但如果您愿意，可以通过css限制高度。

带Rails的中型编辑器

2 个答案: