用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的方 ...
随机推荐
- pygame精灵类实现房子爆炸效果
# coding=utf8 import random import pygame from pygame.locals import * from cStringIO import StringIO ...
- C# 泛型详解---进阶编程(七)
今天我们来学习在C#的泛型技巧,传统的课本都在讲解什么是泛型,然后列举一大堆代码示例告诉你什么是泛型,今天我们就来聊聊更加本质的东西,我为什么要用泛型?它是来解决什么问题的?底层原理是什么? 简单来说 ...
- eclipse启动maven项目
pom.xml 文件. <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://w ...
- Linux环境下 多线程下载 (Python 实现版)
本文是多年前学习编程时参照一个网友程序的基础之上改写的, 采用Python语音编写, 多线程下载功能, 可以有效提高Linux下原有下载工具中的一些不足,以下给出具体代码. #!/usr/bin/py ...
- shell 脚本实战笔记(4)--linux磁盘分区重新挂载
背景: Hadoop的HDFS文件系统的挂载, 默认指定的文件目录是/mnt/disk{N}. 当运维人员, 不小心把磁盘挂载于其他目录, 比如/mnt/data, /mnt/disk01, /mnt ...
- 了解dto概念,什么是DTO
了解dto概念 此博文收集整理了一些主流的文章对于DTO模式的解读,他们大体相似而又各有所不同.对于设计模式的解读也是一个仁者见仁智者见智的事情,不过设计模式往往都是前辈们在遇到一类特定的问题下而 ...
- 在 Laravel 5 中使用 Repository 模式实现业务逻辑和数据访问的分离
1.概述 首先需要声明的是设计模式和使用的框架以及语言是无关的,关键是要理解设计模式背后的原则,这样才能不管你用的是什么技术,都能够在实践中实现相应的设计模式. 按照最初提出者的介绍,Reposito ...
- C# 使用oledb 方式连接本地或者远程oracel 数据库的方式
对于C# 进行oracle 数据库的开发来说使用oracle 提供的odp.net 方式是比较方便的,同时在性能以及兼容性也是比较好的 但是,对于不打算使用的,那么该如何使用oledb 进行连接 连接 ...
- install kde in ubuntu
http://www.arthurtoday.com/2012/08/ubuntu-12.04-install-kde-4.9.html sudo apt-get install kubuntu-de ...
- 【转】每天一个linux命令(48):watch命令
原文网址:http://www.cnblogs.com/peida/archive/2012/12/31/2840241.html watch是一个非常实用的命令,基本所有的Linux发行版都带有这个 ...