用javascript/jQuery给CKEditor取值/赋值
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 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取值/赋值的更多相关文章
- jquery操作select取值赋值与设置选中[转]
本节内容:jquery实现select下拉框的取值与赋值,设置选中的方法大全. 比如<select class="selector"></select> 1 ...
- jquery 元素文本取值/赋值
select元素选中option值 jq $("#select1 option:selected").text(); $("select id或class option: ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
- Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)
Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...
- JQuery TextArea的取值与赋值问题---(textarea中回车清空问题)——个人转载整理
JQuery TextArea的取值与赋值问题---(textarea中回车清空问题) JQuery TextArea的取值与赋值问题 首先,说明这不是一个简单的问题! 先说取值: $("# ...
- Jquery 关于span标签的取值赋值用法
span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...
- JQuery关于span标签的取值赋值
span取值赋值方法有别于一般的页面元素.JQ://赋值$("#spanid").html("hello world") //取值$("#spanid ...
- jquery data方法取值与js attr取值的区别
<a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...
- winform 批量控件取值赋值
以前写winform 最多写几个文本框,最近需要入录一个人员信息,那好几十个字段,一下子干蒙了,这要是一个个取值赋值都写到明天了,于是就自己写了个方法,也不是什么高大上的,就是很简单很普通很low的方 ...
随机推荐
- 卡巴斯基KAV2013 – 免费一年 (六一活动)
赠送时间:2013年5月31日10时 至 2013年6月1日24时赠送产品:卡巴斯基反病毒软件2013(一年版)赠送方式:产品激活码将以电邮方式发送到您提交信息的邮箱里,每个邮箱仅能领取一个激活码.温 ...
- zabbix 爆高危 SQL 注入漏洞,可获系统权限(profileIdx 2 参数)
漏洞概述 zabbix是一个开源的企业级性能监控解决方案.近日,zabbix的jsrpc的profileIdx2参数存在insert方式的SQL注入漏洞,攻击者无需授权登陆即可登陆zabbix管理系统 ...
- node-webkit 入门
下载node-webkit 点击这里: https://github.com/rogerwang/node-webkit 找到Downloads这一小节,然后下载对应平台的node-webkit预编译 ...
- QLabel 内容长度超过控件本身长度时超出的部分用省略号
void JunEditableLabel::setText(const QString &string) { QFont font("Tahoma"); font.set ...
- 【论文解读】行人检测:What Can Help Pedestrian Detection?(CVPR'17)
前言 本篇文章出自CVPR2017,四名作者为Tsinghua University,Peking University, 外加两名来自Megvii(旷视科技)的大佬. 文章中对能够帮助行人检测的ex ...
- Codeforces Round #462 (Div. 2) B-A Prosperous Lot
B. A Prosperous Lot time limit per test 1 second memory limit per test 256 megabytes input standard ...
- HDU 4647 Another Graph Game 想法类
解题思路:若没有边权,则对点权从大到小排序即可.. 考虑边,将边权拆成两半加到它所关联的两个点的点权中即可. ..因为当两个人分别选择不同的点时,这一权值将互相抵消. 以上摘自杭电的解题报告. 至于为 ...
- JS Array.filter()方法
1.filter()接收的函数可以有多个参数.通常我们只使用第一个参数,第二参数和第三个参数表示元素的位置和数组本身: //去重 var arr = ["1", "2&q ...
- setsockopt IP_ADD_MEMBERSHIP error!No such device的解决方案
/mnt # ./onvifserver Happytime onvif server version 2.6Onvif server running at 192.168.1.10:8000crea ...
- 【转】每天一个linux命令(14):head 命令
原文网址:http://www.cnblogs.com/peida/archive/2012/11/06/2756278.html head 与 tail 就像它的名字一样的浅显易懂,它是用来显示开头 ...