长知识博客网站,一个编程知识分享网站! Email: 1437393071@qq.com

artEditor移动端富文本编辑器使用简单介绍

分类: 前端 浏览量: 留言数: 98495

本文介绍一款基于jquery开发的移动端富文本编辑器的使用方法,需要的朋友可以做一下参考。

artEditor是一款基于jQuery的移动端富文本编辑器,支持插入图片等功能。

插件地址:https://github.com/baixuexiyang/artEditor。

一.引入页面:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="artEditor.min.js"></script>

二.参数介绍:

(1).imgTar:图片上传按钮。

(2).limitSize:图片最大限制,默认3兆。

(3)showServer:显示从服务端返回的图片,默认是显示本地资源的图片。

(4).uploadUrl:图片上传路劲。

(5).data:上传图片其他参数。

(6).uploadField:上传图片字段。

(7).placeholader:富文本编辑器holder。

(8).validHtml:粘贴时,去除不合法的html标签。

(9).uploadSuccess:图片上传成功回调。

(10).uploadError:图片上传失败回调。

三.代码片段:

<div id="content">
</div>

上面是html代码。

$('#content').artEditor({
  imgTar: '#imageUpload',
  limitSize: 5, // 兆
  showServer: false,
  uploadUrl: '',
  data: {},
  uploadField: 'image',
  placeholader: '<p>请输入文章正文内容</p>',
  validHtml: ["br"],
  uploadSuccess: function(res) {
    // return img url
    return res.path;
  },
  uploadError: function(res) {
    // something error
    console.log(res);
  }
});

上面是js代码。

artEditor移动端富文本编辑器使用简单介绍,这样的场景在实际项目中还是用的比较多的,关于artEditor移动端富文本编辑器使用简单介绍就介绍到这了。

artEditor移动端富文本编辑器使用简单介绍属于前端实例代码,有关更多实例代码大家可以查看。

本文地址: http://www.zzsi.net/code/web/98495.html

本站部分资源来源与网络,仅供学习参考使用,请勿商用,如侵犯了您的权益,请联系我们删除。

标签: 上一篇: 下一篇:
在线留言CONTACT US

评论功能已关闭

展开更多