Javascript 如何在rails中设置cktext_区域的背景色/图像

我正在将Rails 3.0.9与ckedit gem一起使用

我在视图中有以下代码

<%= f.cktext_area :content, :toolbar => 'Reduced', :width => 550, :height => 300 %>

“缩小”，：宽度=>550，：高度=>300%>

如何设置结果编辑器的样式以设置编辑区域的背景色以指示验证失败？对于

“错误”

，我想不出正确的方法

---

非常感谢你的帮助-我已经到处寻找一个像样的答案

您是否尝试将此作为添加参数添加

<%= f.cktext_area :content, <params>, :html => {:class => 'error'} %>

{:class=>'error'}%>

---

然后，您可以使用条件逻辑来设置正确的类名。

我还没有使用过ckedit gem（或Rails），但这里有一些配置设置和方法，您可以尝试

---

使用配置设置创建实例时，可以分配类（或ID）：

<%= f.cktext_area :content, :bodyClass => 'yourBodyClass', :bodyId => 'yourBodyId'>

这是API页面：

---

您可能需要根据具体情况更改颜色。如果是这样，您可以将JavaScript或Rails变量替换为颜色，使其成为动态的

var colorValue = '<%= colorVariable >';

CKEDITOR.instances.content.addCss( 'body { background-color: '+colorValue+'; }' );
CKEDITOR.instances.content.addCss( 'body { background-color: '<%= colorVariable >'; }' );

祝你身体健康，

---

乔

太棒了<代码>:bodyClass=>'error'在我的contents.css中添加了

.error{background color:#f99；}

，效果很好。非常感谢您的欢迎，我很高兴这对您有所帮助。

var colorValue = '<%= colorVariable >';

CKEDITOR.instances.content.addCss( 'body { background-color: '+colorValue+'; }' );
CKEDITOR.instances.content.addCss( 'body { background-color: '<%= colorVariable >'; }' );

// Wait for the document ready event
$(document).ready(function(){

  // Wait for the instanceReady event to fire for the "content" instance
  // The instance name is "content"
  CKEDITOR.instances.content.on( 'instanceReady',
    function( instanceReadyEventObj )
    {
      var currentEditorInstance = instanceReadyEventObj.editor;
      var iframeDoc=null;

      // Create the function
      function setIframeBackground( colorVariable )
      {
        // The CKEditor content iframe doesn't have a Name, Id or Class
        // So, we'll assign an ID to the iframe
        // it's inside a table data cell that does have an Id.
        // The Id of the data cell is "cke_contents_content"
        // Note that the instance name is the last part of the Id
        // I'll follow this convention and use an Id of "cke_contents_iframe_content"

        $("#cke_contents_content iframe").attr("id", "cke_contents_iframe_content");

        // Now use the iframe Id to get the iframe document object
        // We'll need this to set the context and access items inside the iframe

        $('#cke_iframe_content').each(
          function(){ iframeDoc=this.contentWindow.document;}
        );

        // Finally we can access the iframe body and set the background color.
        // The Id of the body is set to "yourBodyId".
        // We use the iframe document object (iframeDoc) to set the context.
        // We use the "colorVariable" variable assigned in the function call.

        $('#' + yourBodyId, iframeDoc).css("background-color", colorVariable);
      }
    }
  );
});