最近在搞 王编辑器 ,但是却不支持视频上传。只能自己去修改源代码。将上传图片变为可支持的上传视频。
如果觉得麻烦 可以安装我的版本。如果已经安装过 请先卸载之前的版本
npm uninstall wangediror@你自己的版本 --save
再执行

npm i guoeditor

以下为修改的全部源代码。即可粘贴复制。

(function (global, factory) {typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :typeof define === 'function' && define.amd ? define(factory) :(global.wangEditor = factory());
}(this, (function () { 'use strict';/*poly-fill
*/var polyfill = function () {// Object.assignif (typeof Object.assign != 'function') {Object.assign = function (target, varArgs) {// .length of function is 2if (target == null) {// TypeError if undefined or nullthrow new TypeError('Cannot convert undefined or null to object');}var to = Object(target);for (var index = 1; index < arguments.length; index++) {var nextSource = arguments[index];if (nextSource != null) {// Skip over if undefined or nullfor (var nextKey in nextSource) {// Avoid bugs when hasOwnProperty is shadowedif (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {to[nextKey] = nextSource[nextKey];}}}}return to;};}// IE 中兼容 Element.prototype.matchesif (!Element.prototype.matches) {Element.prototype.matches = Element.prototype.matchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector || function (s) {var matches = (this.document || this.ownerDocument).querySelectorAll(s),i = matches.length;while (--i >= 0 && matches.item(i) !== this) {}return i > -1;};}};/*DOM 操作 API
*/// 根据 html 代码片段创建 dom 对象function createElemByHTML(html) {var div = void 0;div = document.createElement('div');div.innerHTML = html;return div.children;}// 是否是 DOM Listfunction isDOMList(selector) {if (!selector) {return false;}if (selector instanceof HTMLCollection || selector instanceof NodeList) {return true;}return false;}// 封装 document.querySelectorAllfunction querySelectorAll(selector) {var result = document.querySelectorAll(selector);if (isDOMList(result)) {return result;} else {return [result];}}// 记录所有的事件绑定var eventList = [];// 创建构造函数function DomElement(selector) {if (!selector) {return;}// selector 本来就是 DomElement 对象,直接返回if (selector instanceof DomElement) {return selector;}this.selector = selector;var nodeType = selector.nodeType;// 根据 selector 得出的结果(如 DOM,DOM List)var selectorResult = [];if (nodeType === 9) {// document 节点selectorResult = [selector];} else if (nodeType === 1) {// 单个 DOM 节点selectorResult = [selector];} else if (isDOMList(selector) || selector instanceof Array) {// DOM List 或者数组selectorResult = selector;} else if (typeof selector === 'string') {// 字符串selector = selector.replace('/\n/mg', '').trim();if (selector.indexOf('<') === 0) {// 如 <div>selectorResult = createElemByHTML(selector);} else {// 如 #id .classselectorResult = querySelectorAll(selector);}}var length = selectorResult.length;if (!length) {// 空数组return this;}// 加入 DOM 节点var i = void 0;for (i = 0; i < length; i++) {this[i] = selectorResult[i];}this.length = length;}// 修改原型DomElement.prototype = {constructor: DomElement,// 类数组,forEachforEach: function forEach(fn) {var i = void 0;for (i = 0; i < this.length; i++) {var elem = this[i];var result = fn.call(elem, elem, i);if (result === false) {break;}}return this;},// cloneclone: function clone(deep) {var cloneList = [];this.forEach(function (elem) {cloneList.push(elem.cloneNode(!!deep));});return $(cloneList);},// 获取第几个元素get: function get(index) {var length = this.length;if (index >= length) {index = index % length;}return $(this[index]);},// 第一个first: function first() {return this.get(0);},// 最后一个last: function last() {var length = this.length;return this.get(length - 1);},// 绑定事件on: function on(type, selector, fn) {// selector 不为空,证明绑定事件要加代理if (!fn) {fn = selector;selector = null;}// type 是否有多个var types = [];types = type.split(/\s+/);return this.forEach(function (elem) {types.forEach(function (type) {if (!type) {return;}// 记录下,方便后面解绑eventList.push({elem: elem,type: type,fn: fn});if (!selector) {// 无代理elem.addEventListener(type, fn);return;}// 有代理elem.addEventListener(type, function (e) {var target = e.target;if (target.matches(selector)) {fn.call(target, e);}});});});},// 取消事件绑定off: function off(type, fn) {return this.forEach(function (elem) {elem.removeEventListener(type, fn);});},// 获取/设置 属性attr: function attr(key, val) {if (val == null) {// 获取值return this[0].getAttribute(key);} else {// 设置值return this.forEach(function (elem) {elem.setAttribute(key, val);});}},// 添加 classaddClass: function addClass(className) {if (!className) {return this;}return this.forEach(function (elem) {var arr = void 0;if (elem.className) {// 解析当前 className 转换为数组arr = elem.className.split(/\s/);arr = arr.filter(function (item) {return !!item.trim();});// 添加 classif (arr.indexOf(className) < 0) {arr.push(className);}// 修改 elem.classelem.className = arr.join(' ');} else {elem.className = className;}});},// 删除 classremoveClass: function removeClass(className) {if (!className) {return this;}return this.forEach(function (elem) {var arr = void 0;if (elem.className) {// 解析当前 className 转换为数组arr = elem.className.split(/\s/);arr = arr.filter(function (item) {item = item.trim();// 删除 classif (!item || item === className) {return false;}return true;});// 修改 elem.classelem.className = arr.join(' ');}});},// 修改 csscss: function css(key, val) {var currentStyle = key + ':' + val + ';';return this.forEach(function (elem) {var style = (elem.getAttribute('style') || '').trim();var styleArr = void 0,resultArr = [];if (style) {// 将 style 按照 ; 拆分为数组styleArr = style.split(';');styleArr.forEach(function (item) {// 对每项样式,按照 : 拆分为 key 和 valuevar arr = item.split(':').map(function (i) {return i.trim();});if (arr.length === 2) {resultArr.push(arr[0] + ':' + arr[1]);}});// 替换或者新增resultArr = resultArr.map(function (item) {if (item.indexOf(key) === 0) {return currentStyle;} else {return item;}});if (resultArr.indexOf(currentStyle) < 0) {resultArr.push(currentStyle);}// 结果elem.setAttribute('style', resultArr.join('; '));} else {// style 无值elem.setAttribute('style', currentStyle);}});},// 显示show: function show() {return this.css('display', 'block');},// 隐藏hide: function hide() {return this.css('display', 'none');},// 获取子节点children: function children() {var elem = this[0];if (!elem) {return null;}return $(elem.children);},// 获取子节点(包括文本节点)childNodes: function childNodes() {var elem = this[0];if (!elem) {return null;}return $(elem.childNodes);},// 增加子节点append: function append($children) {return this.forEach(function (elem) {$children.forEach(function (child) {elem.appendChild(child);});});},// 移除当前节点remove: function remove() {return this.forEach(function (elem) {if (elem.remove) {elem.remove();} else {var parent = elem.parentElement;parent && parent.removeChild(elem);}});},// 是否包含某个子节点isContain: function isContain($child) {var elem = this[0];var child = $child[0];return elem.contains(child);},// 尺寸数据getSizeData: function getSizeData() {var elem = this[0];return elem.getBoundingClientRect(); // 可得到 bottom height left right top width 的数据},// 封装 nodeNamegetNodeName: function getNodeName() {var elem = this[0];return elem.nodeName;},// 从当前元素查找find: function find(selector) {var elem = this[0];return $(elem.querySelectorAll(selector));},// 获取当前元素的 texttext: function text(val) {if (!val) {// 获取 textvar elem = this[0];return elem.innerHTML.replace(/<.*?>/g, function () {return '';});} else {// 设置 textreturn this.forEach(function (elem) {elem.innerHTML = val;});}},// 获取 htmlhtml: function html(value) {var elem = this[0];if (value == null) {return elem.innerHTML;} else {elem.innerHTML = value;return this;}},// 获取 valueval: function val() {var elem = this[0];return elem.value.trim();},// focusfocus: function focus() {return this.forEach(function (elem) {elem.focus();});},// parentparent: function parent() {var elem = this[0];return $(elem.parentElement);},// parentUntil 找到符合 selector 的父节点parentUntil: function parentUntil(selector, _currentElem) {var results = document.querySelectorAll(selector);var length = results.length;if (!length) {// 传入的 selector 无效return null;}var elem = _currentElem || this[0];if (elem.nodeName === 'BODY') {return null;}var parent = elem.parentElement;var i = void 0;for (i = 0; i < length; i++) {if (parent === results[i]) {// 找到,并返回return $(parent);}}// 继续查找return this.parentUntil(selector, parent);},// 判断两个 elem 是否相等equal: function equal($elem) {if ($elem.nodeType === 1) {return this[0] === $elem;} else {return this[0] === $elem[0];}},// 将该元素插入到某个元素前面insertBefore: function insertBefore(selector) {var $referenceNode = $(selector);var referenceNode = $referenceNode[0];if (!referenceNode) {return this;}return this.forEach(function (elem) {var parent = referenceNode.parentNode;parent.insertBefore(elem, referenceNode);});},// 将该元素插入到某个元素后面insertAfter: function insertAfter(selector) {var $referenceNode = $(selector);var referenceNode = $referenceNode[0];if (!referenceNode) {return this;}return this.forEach(function (elem) {var parent = referenceNode.parentNode;if (parent.lastChild === referenceNode) {// 最后一个元素parent.appendChild(elem);} else {// 不是最后一个元素parent.insertBefore(elem, referenceNode.nextSibling);}});}};// new 一个对象function $(selector) {return new DomElement(selector);}// 解绑所有事件,用于销毁编辑器$.offAll = function () {eventList.forEach(function (item) {var elem = item.elem;var type = item.type;var fn = item.fn;// 解绑elem.removeEventListener(type, fn);});};/*配置信息
*/var config = {// 默认菜单配置menus: ['head', 'bold', 'fontSize', 'fontName', 'italic', 'underline', 'strikeThrough', 'foreColor', 'backColor', 'link', 'list', 'justify', 'quote', 'emoticon', 'image', 'table', 'video', 'code', 'undo', 'redo'],fontNames: ['宋体', '微软雅黑', 'Arial', 'Tahoma', 'Verdana'],colors: ['#000000', '#eeece0', '#1c487f', '#4d80bf', '#c24f4a', '#8baa4a', '#7b5ba1', '#46acc8', '#f9963b', '#ffffff'],// // 语言配置// lang: {//     '设置标题': 'title',//     '正文': 'p',//     '链接文字': 'link text',//     '链接': 'link',//     '插入': 'insert',//     '创建': 'init'// },// 表情emotions: [{// tab 的标题title: '默认',// type -> 'emoji' / 'image'type: 'image',// content -> 数组content: [{alt: '[坏笑]',src: 'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/50/pcmoren_huaixiao_org.png'}, {alt: '[舔屏]',src: 'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/40/pcmoren_tian_org.png'}, {alt: '[污]',src: 'http://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/3c/pcmoren_wu_org.png'}]}, {// tab 的标题title: '新浪',// type -> 'emoji' / 'image'type: 'image',// content -> 数组content: [{src: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7a/shenshou_thumb.gif',alt: '[草泥马]'}, {src: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/60/horse2_thumb.gif',alt: '[神马]'}, {src: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/bc/fuyun_thumb.gif',alt: '[浮云]'}]}, {// tab 的标题title: 'emoji',// type -> 'emoji' / 'image'type: 'emoji',// content -> 数组content: '												

wangeditor支持图片和视频上传相关推荐

  1. thinkphp5图片或者视频上传

    thinkphp5图片或者视频上传 public function addgoodspic(){$data = input('post.');$data3['goods_id']= $data['go ...

  2. 封装一个完整版的uniapp图片和视频上传组件,拿来即用,可进行图片视频切换,可自定义上传按钮样式,删除按钮样式,可单独上传图片或者视频,可限制上传数量

    第一步 components里面新建一个manyImgUpload.vue组件,将以下代码放入 以下代码中需要你改的地方 uni.uploadFile中的参数,url为你公司的上传接口.files为你 ...

  3. uni-app图片、视频上传

    uni-app图片.视频上传 1.上传按钮 // template <view class="add-circle" @click="handlePostType& ...

  4. iOS图片,视频上传视频内容旋转

    #前言 我最近在接手一个智能盒子的iOS应用,上面有一个功能是这样的.把你本地的照片和视频可以甩屏到你绑定的盒子上. 我的上一位前辈做的时候必须要求再同一个局域网,但是当我做的时候要求不同的局域网也要 ...

  5. quill富文本编辑器——修改默认图片、视频上传功能

    quill富文本编辑器默认的图片上传是将图片地址转换为base64格式,可能会导致字段过长:默认的视频上传是插入iframe标签,与需要的video标签不符合 图片上传 初始化编辑器时重写image上 ...

  6. 使用富文本编辑器wangEditor完成图片文件的上传

    项目中一些特定的功能可能需要在页面中用到富文本编辑器来实现文件的输入上传等等,在这里用wangEditor来实现使用富文本编辑器进行文件图面的输入和上传保存,这里wangEditor也可以参考wang ...

  7. 抖音照片图集怎么制作,如何将图片做成视频上传抖音?

    抖音最近被很多人当做茶余饭后不可或缺的娱乐项目,丰富了很多人的业余生活,也成就了很多抖音人,经常在抖音上会看到很多不是直接拍摄的视频,而是通过图片图集的方式展示出来的视频,图片中还可以配上相应的文字, ...

  8. java图片和视频上传_Java实现视频网站的视频上传、视频转码、视频关键帧抽图, 及视频播放功能(转)...

    视频网站中提供的在线视频播放功能,播放的都是FLV格式的文件,它是Flash动画文件,可通过Flash制作的播放器来播放该文件.项目中用制作的player.swf播放器. 多媒体视频处理工具FFmpe ...

  9. uniapp怎么调起摄像头拍视频_uni-app实现图片和视频上传功能

    var sourceType =[ ['camera'], ['album'], ['camera', 'album'] ] exportdefault{ data() {return{ imageL ...

最新文章

  1. [Leetcode][第332题][JAVA][重新安排行程][欧拉回路 / 欧拉通路][优先队列][DFS]
  2. python实现链表的删除_Python中 为我们提供了一些独特的解决方案的方法特性
  3. 用 Java 写一个植物大战僵尸简易版
  4. Flutter中Widget 、Element、RenderObject角色深入分析
  5. Visual Web Developer 中的网站类型
  6. autograd手动仿真手记
  7. Scott Mitchell 的ASP.NET 2.0数据教程之十七:: 研究插入、更新和删除的关联事件
  8. Spring Cloud——服务发现与注册
  9. 私活后的 WPF 设计经验总结
  10. 千万不要花费时间和金钱学习火山软件开发平台 - 递归软件绝非易语言的延续!
  11. Android 热修复原理
  12. 如何利用Python开发一款快手加抖音自动刷视频脚本!
  13. 几个项目管理经典小故事,发人深思
  14. 搭建ARM交叉编译环境
  15. java计算机毕业设计教师管理系统源码+mysql数据库+系统+lw文档+部署
  16. 手把手教会搭建网站详细全过程(从域名到网站部署)
  17. Android之vold进程启动源码分析
  18. bash(CVE-2014-6271) shellshock-破壳漏洞复现
  19. 阿里巴巴倡导的数据中台,到底是什么东东
  20. Centos7使用Docker部署Chemex资产管理系统

热门文章

  1. 使用汉明距离对数据进行聚类
  2. 芝加哥大学计算机专业硕士,芝加哥大学-计算机科学硕士
  3. 4.9 Selenium 库趣味案例:网页自动投票
  4. uni-app使用微信小程序的插件
  5. Vue是什么?在前端学习中有什么作用呢?
  6. c盘文件移动到d盘(win7c盘文件移动到d盘)
  7. python多线程实现访问页面升级_python使用多线程不断刷新网页的方法
  8. STM32通过SDIO读取SD卡,FATFS文件管理系统
  9. INN:utilization/u-rate/density
  10. Linux系统编程(一)——环境搭建