java文本编辑器插件kinderditor用法解决本地图片上传不能用

第一步:去kinderditor官网下载一个最新的kinderditor包,这是一个压缩包,解压缩后放到webroot下面。但是放到你的webroot下面,有可能会报错,就是你的kinderditor包的jsp和code这两个包出现差号,解决办法,jsp点开出错的网页看缺少那些jar包,把相对应的jar包拷到lib下面,然后config path部署一下,就可以解决了,code包出错的原因是电脑的版本不支持,我也不大清楚,可以不用去理会,让他报错就是,不影响功能使用,你放到别的电脑上有的报错会消失,也许你的电脑本神不会报错那更好。

第二步:在webroot下面新建一个名字为attached的包,名字不可变,应为kinderditor插件设定的就是名字attached的路径,用来上传本地图片

第三步:jsp代码:

首先引入一个css和2个js,注意下面的是相对路径因为我的jsp用了<base href="<%=basePath%>">只需要写项目名后面的路径

<link rel="stylesheet" href="kindeditor/themes/default/default.css" />
<script charset="utf-8" src="kindeditor/kindeditor-min.js"></script>
<script charset="utf-8" src="kindeditor/lang/zh_CN.js"></script>

然后写下面这个function,整个代码只需要改textarea的name

<script language="javascript" type="text/javascript">
       KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="sysArticle.articleContent"]', {
resizeType : 1,
allowPreviewEmoticons : false,
allowImageUpload : true,
items : [
 'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'cut', 'copy', 'paste',
        'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
        'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
        'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
        'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
        'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|',
       'table', 'hr','image'],
            afterBlur : function() {
                  this.sync();
                  var content=editor1.text();
                  if(content.length!=0){
                  ok4=true;
                  }else{
                  ok4=false;
                  }
            }
});
});
  </script>

只需这几步就可以出现那个文本编辑器,并且可以上传本地图片,不需要在后台写图片上传的方法。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值