javascript富文本编辑器使我们添加、编辑网站中的文章更加方便和容易。这些富文本编辑器提供了所见即所得(What You See Is What You Get - WYSIWYG)的功能,可以像编辑word文档一样,方便地编辑网站中文章,常用于内容管理系统和博客系统等。

百度Ueditor富文本就是其中之一,个人觉得虽然体积大点,不兼容移动端外,其他功能都非常强大,特别是里面的多图上传!

当有些个性化页面需求时,难免会对她一些优化,已让她适合自己的内容,比如单独调用上传图片实现类似于以下页面时

部分代码如下

    var _editor = UE.getEditor('Thumb');
_editor.ready(function () {
//设置编辑器不可用
//_editor.setDisabled();
//隐藏编辑器,因为不会用到这个编辑器实例,所以要隐藏
_editor.hide();
//侦听图片上传
_editor.addListener('beforeInsertImage', function (t, arg) {
//将地址赋值给相应的input,只去第一张图片的路径
$(".js_cover_preview").css('background-image', 'url(' + arg[0].src + ')');
//图片预览
$("#Thumb").val(arg[0].src);
$('.cover_preview_wrp').show();
});
});
$('.cover_preview_wrp').hover(function () {
$('.js_tip_mask').show();
}, function () {
$('.js_tip_mask').hide();
});
$('#js_appmsg_upload_cover').click(function () {
alert('123');
var myImage = _editor.getDialog("insertimage");
myImage.open();
});

部分参考  http://my.oschina.net/glenxu/blog/476720

ueditor单独调用上传附件和图片的功能的更多相关文章

  1. 上传附件(图片base64)封装方法

    上传附件(图片base64)封装方法 php 上传附件,base64 项目中封装的接口: public function error($msg){ header("Content-type: ...

  2. Dynamics CRM 自定义上传附件的图片悬浮层显示

    CRM中的附件是以流的形式保存在了数据库中,这样做的一个坏处是一旦系统运行时间久,附件上传的多了势必会导致数据库极速扩大,即影响系统的运行效率也对后期的迁移维护带来了不必要的麻烦.所以很多的客户都会要 ...

  3. jmeter 上传附件 如图片

    1.要勾选 Use multipart/form-data for POST,否则request中将不包含上传的文件 2.MIME类型为application/octet-stream 图如下:对应 ...

  4. form表单上传附件的几种方法

    问题描述:在网页开发过程中,当需要上传附件(图片,音频,视频等)时,常规方法是使用form表单进行提交,这里总结一下form表单提交的几种方法. 参考地址:http://www.cnblogs.com ...

  5. React项目中使用wangeditor以及扩展上传附件菜单

    在最近的工作中需要用到富文本编辑器,结合项目的UI样式以及业务需求,选择了wangEditor.另外在使用的过程中发现wangEditor只有上传图片和视频的功能,没有上传文本附件的功能,所以需要对其 ...

  6. ueditor百度编辑器中,多图上传后,图片顺序乱掉的处理方法

    上传后,图片的顺序和预期的不一致,需要修改ueditor的源码. 一.找到editor/dialogs/attachment/attachment.js文件 1.将_this.fileList.pus ...

  7. webservice跨服务器上传附件

    最近一个项目,用到文件上传功能,本来简单地使用upload控件直接post到服务器保存,简单实现了.后来考虑到分布是部署,静态附件.图片等内容要单独服务器(命名为B服务器,一台,192.168.103 ...

  8. jeecms系统使用介绍——通过二次开发实现对word、pdf、txt等上传附件的全文检索

    转载请注明出处:http://blog.csdn.net/dongdong9223/article/details/76912307 本文出自[我是干勾鱼的博客] 之前在文章<基于Java的门户 ...

  9. dropzonejs中文翻译手册 DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库.

    http://wxb.github.io/dropzonejs.com.zh-CN/dropzonezh-CN/ 由于项目需要,完成一个web的图片拖拽上传,也就顺便学习和了解了一下前端的比较新的技术 ...

随机推荐

  1. js继承之Object.create()

    通过 Object.create() 方法,使用一个指定的原型对象和一个额外的属性对象创建一个新对象.这是一个用于对象创建.继承和重用的强大的新接口.说直白点,就是一个新的对象可以继承一个对象的属性, ...

  2. Linux下搭建FTP服务器(Ubuntu16.04)

    搞了下FTP服务器,基本上能遇到的问题都遇到了-.-! 先说步骤: 1.安装vsftpd软件包 sudo apt-get install vsftpd 2.打开配置文件 vim /etc/vsftpd ...

  3. TP3.2写提交的验证码验证

    把今天掌握的东西整理一下,要不然,我就忘干净了: 今天在做一个企业网站的时候,有一个在线留言的功能,最后提交的时候需要输入验证码.如图下: 当然,特连接的并不是我的后台 好了,开始了,首先我需要把验证 ...

  4. MySQL 启动参数说明及性能优化建议

    [mysqld] port = 3306 serverid = 1 socket = /tmp/mysql.sock skip-name-resolve #禁止MySQL对外部连接进行DNS解析,使用 ...

  5. JQueryEasyUI学习简单Demo

    一.Layout布局 声明:此文档参考了jQuery EasyUI官方文档 布局容器有5个区域:北.南.东.西和中间.中间区域面板是必须的,边缘的面板都是可选的.每个边缘区域面板都可以通过拖拽其边框改 ...

  6. centos下安装并配置tomcat

    1,安装jdk,centos默认安装了java-openjdk的环境,但是不带JDK,运行 yum install java-1.7.0-openjdk java-1.7.0-openjdk-deve ...

  7. docker在Centos上的安装

    Centos6安装docker 系统:centos6.5 内核:3.10.107-1(已升级),docker对RHEL/Centos的最低内核支持是2.6.32-431,epel源的docker版本推 ...

  8. ES6中的模块

    前面的话 JS用"共享一切"的方法加载代码,这是该语言中最容出错且容易令人感到困惑的地方.其他语言使用诸如包这样的概念来定义代码作用域,但在ES6以前,在应用程序的每一个JS中定义 ...

  9. 【bzoj2819】Nim

    Description 著名游戏设计师vfleaking,最近迷上了Nim.普通的Nim游戏为:两个人进行游戏,N堆石子,每回合可以取其中某一堆的任意多个,可以取完,但不可以不取.谁不能取谁输.这个游 ...

  10. 【原创】-- C# 点滴积累 -- String

    一.string.Format() 将[数字字符串]转为两位小数显示的字符串: dt = dtResult.Select(it => new CommodityPriceLimitEntity ...