Question

我正在尝试使用Imperavi Redactor控件进行富文本编辑：

<div class="control-group">
  <%= f.label :description %>
  <div class="controls">
    <%= f.text_area :description, :class => "richtext" %>
  </div>
</div>

$(document).ready(function(){
    $('.richtext').redactor();
});

富文本编辑器显示并且工作正常，但是当我输入内容时，我可以看到使用Google Chrome中的Inspect Element，html标记未被复制到隐藏文本区域。参见：

<div class="controls">
    //Removed toolbar for brevity.
    <div class="redactor_box">
        <div class="redactor_richtext redactor_editor" contenteditable="true" dir="ltr"><p>asdfjoiasjdf</p><p>dfjiasdfjiasd</p><p>idsfj</p><p>asdffaas</p></div>
    </div>

    <textarea class="richtext" cols="40" id="program_description" name="program[description]" rows="20" style="display: none;"></textarea></div>
</div>

当执行此textarea的表单POST时，显然服务器看不到任何内容，因为textarea是空白的。

有关如何将丰富的html复制到textarea的任何建议？我做错了什么？

Answer 1

尝试内置函数$().syncCode()

syncCode: function()
{
    var html = this.formatting(this.$editor.html());
    this.$el.val(html);         
}

或$().setCode()

setCode: function(html)
{
    html = this.preformater(html);

    this.$editor.html(html).focus();

    this.syncCode();
},

Imperavi Redactor内容未被复制到隐藏的textarea

1 个答案: