CKEditor 是著名的 HTML 编辑器,IBM、Oracle、Adobe 等都在用。CKEditor 创建于 2003 年,其前身为 FCKEditor,在 2009 年的时候把“F”去掉了,更名为 CKEditor。其开源协议是基于 GPL, LGPL 和 MPL 的。官方网站:http://ckeditor.com/

一 般来说,我们在编辑内容时,先是读入到 textarea,再将 textarea 的内容赋给编辑器。因为直接把内容作为字符串给编辑器的 Value 属性赋值使用的是 JavaScript 代码,要让 JS 代码不受内容中双引号、换行等的干扰,只有先读入到 textarea 最方便。

 使 用 CKeditor 3.0.1

<textarea&nbsp; cols="90" rows="10" id="content" name="content">cftea</textarea>

<script type="text/javascript" src="http://banu.blog.163.com/blog/ckeditor/ckeditor.js"></script>

<script type="text/javascript">

CKEDITOR.replace("content");

</script>

可以看出,3.x 版本的使用非常方便,也不用担心会形成两个同名的 content。实际上 textarea 的 id 省略了也是可以的,因为 CKEditor 会先按 name 来查找,查找不到,再按 id 来查找。

并且编辑器会在 textarea 的位置替换原有的 textarea。

 设 置编辑器皮肤、宽高

<textarea  cols="90" rows="10" id="content" name="content">cftea</textarea><script type="text/javascript" src="http://banu.blog.163.com/blog/ckeditor/ckeditor.js"></script><script type="text/javascript"><!--   CKEDITOR.replace("content",      {          skin: "kama", width:700, height:300      });//--></script>

skin 值应该是 ckeditor/skins 文件夹下的某个文件夹名称,如果指向不存在的皮肤,则不会显示编辑器。

 设 置值、取值

设置值

CKEDITOR.instances.content.setData("输入文字"); // content 就是前面 CKEDITOR.replace 的第一个参数值

var editor = CKEDITOR.replace("content");
editor.setData("输入文字");

取值

alert(CKEDITOR.instances.content.getData()); // content 就是前面 CKEDITOR.replace 的第一个参数值

var editor = CKEDITOR.replace("content");
alert(editor.getData());

 插 入图片

若要演示此示例,最好是放在按钮的事件处理程序中,目的是有些延迟。

CKEDITOR.instances.content.insertHtml("<img src=...>");

转自:  http://hi.baidu.com/gud613/item/d1e0a833be822226b2c0c504

用javascript/jQuery给CKEditor取值/赋值的更多相关文章

  1. jquery操作select取值赋值与设置选中[转]

    本节内容:jquery实现select下拉框的取值与赋值,设置选中的方法大全. 比如<select class="selector"></select> 1 ...

  2. jquery 元素文本取值/赋值

    select元素选中option值 jq $("#select1 option:selected").text(); $("select id或class option: ...

  3. Jquery操作下拉框(DropDownList)实现取值赋值

    Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...

  4. Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)

    Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...

  5. JQuery TextArea的取值与赋值问题---(textarea中回车清空问题)——个人转载整理

    JQuery TextArea的取值与赋值问题---(textarea中回车清空问题) JQuery TextArea的取值与赋值问题 首先,说明这不是一个简单的问题! 先说取值: $("# ...

  6. Jquery 关于span标签的取值赋值用法

    span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...

  7. JQuery关于span标签的取值赋值

    span取值赋值方法有别于一般的页面元素.JQ://赋值$("#spanid").html("hello world") //取值$("#spanid ...

  8. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  9. winform 批量控件取值赋值

    以前写winform 最多写几个文本框,最近需要入录一个人员信息,那好几十个字段,一下子干蒙了,这要是一个个取值赋值都写到明天了,于是就自己写了个方法,也不是什么高大上的,就是很简单很普通很low的方 ...

随机推荐

  1. 关于plantera

    在Plantera,您可以建立属于您自己的花园,并且看着新的植物,灌木,树木和动物一起生长. 当您进行游戏,扩张您的花园时,您会吸引圆滚滚的蓝色生物小助手们,它们将帮助您捡果子,收获您的植物 有时候会 ...

  2. mysql 易忽略点

  3. 开源项目ScriptGate,Delphi与JavaScript相互调用的神器

    ScriptGate是一个实现TWebBrowser上的JavaScript和Delphi代码相互调用的库,具体在这里:https://bitbucket.org/freeonterminate/sc ...

  4. NBUT 1220 SPY 2010辽宁省赛

    Time limit  1000 ms Memory limit  131072 kB The National Intelligence Council of X Nation receives a ...

  5. Samsung_tiny4412(驱动笔记10)----mdev,bus,device,driver,platform

    /*********************************************************************************** * * mdev,bus,de ...

  6. python海龟绘图

    最近学了python,看了几本书之后,才明白python的强大,python是一种解释型的语言,即每写一行程序就执行一行. 而且在科学计算方面,处理的能力特别的方便. 比如python中的字典dict ...

  7. MySQL主从数据库配置

    使用工具 MySQL数据版本:5.6.36-log. 两台云服务器(Linux系统) 首先,需要在Linux系统下安装MySQL,具体步骤可以参考这里,并且确保两台主机可以相互访问,可以直接ping一 ...

  8. 只需 5 秒钟,你就能取到 WPF 程序的超高分辨率超高清截图

    我想要截取一个 WPF 程序的图标,但是它太小了.如果我就这样截屏截下来,是很不高清的.由于我需要制作一份课件,所以我需要超高清版本,可是,如何做才能最快速拿到 WPF 程序的超高清截图呢? 本文分享 ...

  9. centos7 使用mount 挂载window10 (超简单)

    一直使用vmware tools 挂载,发现好多问题,折腾了大半天放弃了,现在使用mount挂载,发现简单多了 一丶首先添加你需要共享的Windows文件夹,右键 记得要选择 Everyone 和一个 ...

  10. (8)propetry装饰器

    propetry是一个内置函数,用来将一个功能伪装成一个数据属性 property将一个方法伪装成一个数据属性class People: def __init__(self,name,height,w ...