您的位置：首页 > 编程技术 > js  >  jQuery 移动端artEditor富文本编辑器

jQuery 移动端artEditor富文本编辑器

 更新时间：2016年1月14日 10:01  点击：1978

由于手机上打字比较慢，并不适合长篇大论的文章，所以移动端的富文本编辑器很少。artEditor是一款基于jQuery的移动端富文本编辑器，支持插入图片，后续完善其他功能。

插件地址：https://github.com/baixuexiyang/artEditor 欢迎star或fork。

demo

引用：

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

参数：

imgTar

图片上传按钮

limitSize

图片最大限制，默认3兆

showServer

显示从服务端返回的图片，默认是显示本地资源的图片

uploadUrl

图片上传路劲

data

上传图片其他参数

uploadField

上传图片字段

placeholader

富文本编辑器holder

validHtml

粘贴时，去除不合法的html标签

uploadSuccess

图片上传成功回调

uploadError

图片上传失败回调

demo：

html:

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

js:

$('#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);
}
});

以上内容给大家介绍了jQuery 移动端artEditor富文本编辑器的相关知识，希望大家喜欢。

[!--infotagslink--]

相关文章

  • php KindEditor文章内分页的实例方法

    我们这里介绍php与KindEditor编辑器使用时如何利用KindEditor编辑器的分页功能实现文章内容分页，KindEditor编辑器在我们点击分页时会插入代码，我们只要以它为分切符，就...2016-11-25

  • vue项目页面嵌入代码块vue-prism-editor的实现

    这篇文章主要介绍了vue项目页面嵌入代码块vue-prism-editor的实现,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2020-10-30

  • 百度编辑器ueditor修改图片上传默认路径

    本案例非通用，仅作笔记以备用 修改后的结果是 百度编辑器里上传的图片路径为/d/file/upload1...2014-07-03

  • js 检测判断fckeditor是否为空

    js 检测判断fckeditor是否为空 <!-- 用一般的js是不可能获取 fck 编辑器内容的是否有值的，我们得用 FCKeditorAPI接口来实例--> <!DOCTYPE html PUBLIC "-//W3C//DTD...2016-09-20

  • 如何在.Net版本UEditor中添加一个普通按钮

    这篇文章主要介绍了如何在.Net版本UEditor中添加一个普通按钮,需要的朋友可以参考下...2021-09-22

  • 超漂亮的Bootstrap 富文本编辑器summernote

    Summernote 是一个简单，灵活，所见即所得（WYSIWYG）的编辑器，基于 jQuery 和 Bootstrap 构建。对bootstrap 文本编辑器相关知识感兴趣的朋友一起学习吧...2016-04-06

  • KindEditor编辑器调用方法

    KindEditor编辑器调用方法,这个编辑器可使用到任何语言中,他是一个纯js的编辑器,但它默认的编辑是utf-8如果是gb2312编辑的朋友就是KindEditor.js打开,重保存为gb2312...2016-11-25

  • Asp.Net FckEditor在web.config中配置的具体实例

    Asp.Net FckEditor在web.config中配置的具体实例，需要的朋友可以参考一下...2021-09-22

  • 一步步教你在Asp.net Mvc中使用UEditor编辑器

    大家都知道ueditor是百度编辑器，目前使用也比较广泛，下面这篇文章主要是通过一步步的步骤教大家在Asp.net Mvc中使用UEditor编辑器,需要的朋友可以参考借鉴，下面来一起看看吧。...2021-09-22

  • 浅析Yii2集成富文本编辑器redactor实例教程

    yii2集成另外一个强大好用的富文本编辑器Redactor。接下来通过本文给大家介绍Yii2集成富文本编辑器redactor实例教程，感兴趣的朋友一起学习吧...2016-04-28

  • ArtEditor富文本编辑器增加表单提交功能

    artEditor是一款基于jQuery的移动端富文本编辑器，支持插入图片，后续完善其他功能。接下来通过本文给大家介绍ArtEditor富文本编辑器增加表单提交功能，对arteditor编辑器相关知识感兴趣的朋友一起学习吧...2016-04-19

  • .NET中用ICSharpCode.TextEditor自定义代码折叠与高亮

    这篇文章主要给大家介绍了.NET中用ICSharpCode.TextEditor自定义代码折叠与高亮的相关资料，文中通过示例代码与图片介绍的很详细，需要的朋友可以参考借鉴，下面来一起看看吧。...2021-09-22

  • PHP中Ckeditor+Ckfinder配置图片上传功能

    从标题来看我们知道Ckeditor不支持图片上传功能，它是需要一个组件Ckfinder才可以支持上传图片， 本文章就来详细的介绍了如何配置Ckeditor+Ckfinder实现图片上传的功能...2016-11-25

  • FCKeditor配置教程

    首先删除不必要的文件节省空间。凡是以_开头的文件如_samples，_testcases和一些用不到的.asp、.jsp、.cfm文件统统干掉。 2修改fckconfig.js FCKConfig.AutoDetectL...2016-11-25

  • php 中调用fckeditor网页编辑器方法

    下面中要在html 中调用就行了 <script src=”fckeditor/fckeditor.js”></script> <script type=”text/网页特效”> function showfck(){...2016-11-25

  • yii2整合百度编辑器umeditor及umeditor图片上传问题的解决办法

    这篇文章主要介绍了yii2整合百度编辑器umeditor及umeditor图片上传问题的解决办法的相关资料,需要的朋友可以参考下...2016-04-23

  • dotnet封装的kindeditor编辑器控件

    KindEditor很不错，没有ForNet的扩展,我是搞.net开发的,就用它简单封装了一个控件，拖过来即可使用，使用更加简单...2021-09-22

  • 解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法

    下面小编就为大家带来一篇解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧...2017-05-09

  • phpweb更换kindeditor编辑器的过程

    KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化...2016-11-25

  • 使用JavaScript为Kindeditor自定义按钮增加Audio标签

    这篇文章主要介绍了使用JavaScript为Kindeditor自定义按钮增加Audio标签的方法,KindEditor是一套开源的HTML可视化编辑器,需要的朋友可以参考下...2016-03-22