kindeditor使用入门-张国红
kindeditor是在线编辑器,比较好用,以下是提供的使用这个插件的步骤。
专注于为中小企业提供成都网站建设、网站制作服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业明溪免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了近千家企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
下载kindeditor-4.1.10.zip
解压
asp,asp.net,php对于jsp开发没有用,可以删除
新建web工程,拷贝文件
在WebRoot目录下新建一个文件夹
这个文件夹是将来上传图片时用的,这是kindeditor默认的,当然也可以改,建议先按照这个文档入了门后,再行修改。
和attached一样,在WebRoot目录下新建目录kindeditor目录,把上面解压后的文件拷贝到这个目录下。
需要把jsp目录下的lib目录下的jar包拷贝到WEB-INF/lib目录下
修改index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() +"://"
+ request.getServerName() +":" + request.getServerPort()
+ path +"/";
%>
"pragma" content="no-cache">
"cache-control" content="no-cache">
"expires" content="0">
"keywords" content="keyword1,keyword2,keyword3">
"description" content="This is my page">
"stylesheet" href="kindeditor/themes/default/default.css" />
"stylesheet" href="kindeditor/plugins/code/prettify.css" />
KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="article.content1"]', {
cssPath :'kindeditor/plugins/code/prettify.css',
uploadJson :'kindeditor/jsp/upload_json.jsp',
fileManagerJson :'kindeditor/jsp/file_manager_json.jsp',
allowFileManager :true,
afterCreate :function() {
var self =this;
K.ctrl(document, 13,function() {
self.sync();
document.forms['example'].submit();
});
K.ctrl(self.edit.doc, 13,function() {
self.sync();
document.forms['example'].submit();
});
}
});
//prettyPrint();
});
新增servlet,接收index.jsp的提交
新增index2.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() +"://"
+ request.getServerName() +":" + request.getServerPort()
+ path +"/";
%>
"pragma" content="no-cache">
"cache-control" content="no-cache">
"expires" content="0">
"keywords" content="keyword1,keyword2,keyword3">
"description" content="This is my page">
"stylesheet" href="kindeditor/themes/default/default.css" />
"stylesheet" href="kindeditor/plugins/code/prettify.css" />
KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="article.content1"]', {
cssPath :'kindeditor/plugins/code/prettify.css',
uploadJson :'kindeditor/jsp/upload_json.jsp',
fileManagerJson :'kindeditor/jsp/file_manager_json.jsp',
allowFileManager :true,
afterCreate :function() {
var self =this;
K.ctrl(document, 13,function() {
self.sync();
document.forms['example'].submit();
});
K.ctrl(self.edit.doc, 13,function() {
self.sync();
document.forms['example'].submit();
});
}
});
//prettyPrint();
});
以上是简单的入门测试。
名称栏目:kindeditor使用入门-张国红
网址分享:http://ybzwz.com/article/ghhpic.html