Jquery 对Ckeditor 取值

Ckeditor 前身是FCKeditor。一个还不错的富文本编辑器。

昨天用到了这个插件，这个插件本来在系统中已经使用过的，准备照搬代码，却发现，上一个离职的哥们写的代码，有点小问题。

代码如下

<script type="text/javascript" src="../js/ckeditor/ckeditor.js"></script>

<textarea id="content" name="content">${model.content}</textarea>

<script type="text/javascript">
  CKEDITOR.replace( 'content' );
</script>

　　然后表单直接这样被提交到后台的话，后台取的是name为content的值，这样的话，后台是取不到任何的值的。

然后去网上找了半天，终于找到了可以用的，用jquery取Ckeditor 的值。

<script type="text/javascript" src="../js/ckeditor/ckeditor.js"></script>

<textarea id="content" name="content">${model.content}</textarea>
<script type="text/javascript">
  CKEDITOR.replace( 'content' );
 function getContenet(){
      return CKEDITOR.instances.content.getData();    //获取textarea的值
  }
</script>

这样的话，我们直接调用getContenet()这个方法，就可以取到当前这个textarea的值了。

因为我们系统是采用了Spring的MVC模式，所以再提交这个表单的时候，只需把取到的值再重新赋值给名字为content的textarea元素就可以了。 

代码如下：

<script type="text/javascript">

var kcontent=getContenet();

   if(kcontent.length==0){
    errorMsg("提示信息：","邮件内容不能为空！");
    }else{
        $("#content").val(kcontent);
    }

</script>

<textarea id="content" name="content">${model.content}</textarea>
<script type="text/javascript">
  CKEDITOR.replace( 'content' );
 function getContenet(){
      return CKEDITOR.instances.content.getData();    //获取textarea的值
  }
</script>

 

直接对content这个元素取值，是取不到的。$("#content")这样取出来的是空，我猜想，他这个插件应该是在内部用一种div的形式覆盖在了这个textarea元素上面。

具体的还有待查资料考证一下。

CKEDITOR.instances.content.getData();    //获取textarea的值

这段代码是重点。

当然，表单验证的话，也需要小小修改了。直接判断 $("#content") 是否为空是不行的。理由上面已经讲到了，这点需要注意下。