tui-editor 和 wangeditor

2024-08-31

是时候选择一款富文本编辑器了（wangEditor）

需要一款富文本编辑器,当然不能自己造轮子.本来想使用cnblog也在用的TinyMCE,名气大,功能全.但是发现TinyMCE从4.0开始,不再支持直接下载.所以还是决定选用wangEditor.遗憾的是作者在园子的博客已经很久不更新了. 官网:http://www.wangeditor.com/index.html 示例 :(其中的 wangEditor.min.js可以从https://www.kancloud.cn/wangfupeng/wangeditor3/335769 下载) <!

利用wangEditor获取文章格式和内容

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server&quo

重构wangEditor（web富文本编辑器），欢迎指正！

提示:最新版wangEditor请参见:wangEditor.github.io 或者 https://github.com/wangfupeng1988/wangEditor 1. 前言 (下载源码.使用说明.demo,请参见:https://github.com/wangfupeng1988/wangEditor) 前段时间做过一个基于bootstrap的富文本编辑器——wangEditor,并发布到github上(https://github.com/wangfupeng1988/wang

富文本编辑器 - wangEditor 上传图片

效果: . 项目结构图: wangEditor-upload-img.html代码: <html> <head> <title>wangEditor-图片上传</title> <link rel="stylesheet" href="wangEditor/css/wangEditor-1.3.0.min.css"> <style type="text/css"> .wrap{

两种为wangEditor添加拖拽调整高度的方式：CSS3和jQuery UI

wangEditor是一款优秀的Web富文本编辑器,但如果能像KindEditor那样支持拖拽调整高度就更好了.有两种方式可以为wangEditor添加这一功能,这里使用的wangEditor版本为2.1.22. 第一种方式是最简单,也是比较完美的一种方式:为编辑器元素添加值为vertical的resize CSS样式: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type"

wangEditor的jQuery插件化

wangEditor是一款优秀的Web富文本编辑器.这篇随笔中讲述的wangEditor版本是2.1.22,由于它依赖于jQuery(作者打算在第三版中取消对jQuery的依赖),那么如果能使用$("#editor").wangeditor()的方式创建和获取编辑器,就再好不过了.为了达到这个目的,需要为jQuery定制一款插件,代码如下: (function ($) { // 用于存储所有编辑器实例的对象.由于wangEditor不支持从原始元素或其id获取已经创建好的编辑器实例,使

wangeditor Demo

<html> <head>  <meta charset="UTF-8"> <title>wangEditor demo</title> </head> <body>  <script src="http://cdn.bootcss

【前端】wangEditor（富文本编辑器）简易使用示例

转载请说明作者或者注明出处,谢谢说到前端常用的编辑器,自然也少不了富文本编辑器(RichText Editor) 笔者在此之前也看了一些相关的在线编辑器,其中包括了当百度搜索“富文本编辑器”字样时出现在最上面的百度UEditor,里面的功能相当丰富,但是配置也相对复杂,对于使用者要求较高.况且在轻量级网页应用的开发中也并不需要如此多的功能,所以真正需要的是一个使用简单的轻量级富文本编辑器,出于方便考虑,也应该尽可能保证“所见即所得”原则. wangEditor正是其中之一(官网链接:wangE

wangEditor使用简记

页面  <div style="width:800px">  <textarea id="textarea1" style="height:400px;max-height:500px;"> <p>请输入内容...</p> </textarea> </div> <button id

wangeditor富编辑器在node和vue前后台分离的使用

本来是想用百度的ueditor编辑器来达到想要的功能的,但在使用中,感觉前后台分离上,需要引入的东西过多,不轻量:然后就去尝试用wangeditor(这个名字听着感觉有点太随意的感觉....但功能上还是很严谨,很轻量的): 官网:https://www.kancloud.cn/wangfupeng/wangeditor3/335782 具体使用方法如下: 一:我使用的开发环境后台是用的express生成器,生成的后台node环境: 前台是用的vue-cli的脚手架直接搭建的项目: 二:前台的配

wangEditor 图片上传失败提示

wangEditor 官网自定义上传事件:https://www.kancloud.cn/wangfupeng/wangeditor2/123689 声明:我用的wangEditor版本是2.1.23 js: var editor = new wangEditor('div1'); // 普通的自定义菜单 editor.config.menus = [ ···]; // 上传图片 editor.config.uploadImgUrl = '***'; editor.config.uploadIm

wangEditor 菜单栏随页面滚动位置改变（吸顶）问题解决

参考:https://www.kancloud.cn/wangfupeng/wangeditor2/113980 当页面向下滚动到隐藏了菜单栏时,编辑器默认会fixed菜单栏,即让菜单栏保持『吸顶』状态.但是可以通过editor.config.menuFixed 关闭fixed状态,也可以修改数值来改变菜单fixed时候距离浏览器的上边距. <div id="div1"> <p>请输入内容...</p> </div> <!--这里引

使用wangEditor富文本编辑器

客户端配置说明下载百度网盘地址:点我下载下载密码:x09x 使用首先要引入wangEditor的js文件,然后引入jQuery 然后在body里: <body> <button id="btn1">查看HTML内容</button> <button id="btn2">查看文本内容</button> <button id="btn3">设置Edit文本</but

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

在最近的工作中需要用到富文本编辑器,结合项目的UI样式以及业务需求,选择了wangEditor.另外在使用的过程中发现wangEditor只有上传图片和视频的功能,没有上传文本附件的功能,所以需要对其扩展一个上传附件的功能. 我们的项目前端是用的react框架,在这里就记录一下我在项目中对wangEditor的简单封装使用以及扩展上传附件菜单. 需要购买阿里云产品和服务的,点击此链接领取优惠券红包,优惠购买哦,领取后一个月内有效: https://promotion.aliyun.com/ntm

常见网页编辑器(富文本，Markdown，代码编辑等)

编辑器:网页不常用的功能,但却又是不可少的功能,如果要造个编辑器轮子,它可以把人玩死!!前端几大禁忌就有富文本, 为什么都说富文本编辑器是天坑? 下面记录一下常见的一些编辑器,该文随时更新: 富文本编辑器 Tinymce tinymce 是一家老牌做富文本的公司,它的产品经受了市场的认可,不管是文档还是配置的自由度都很好. tinymce 的去格式化相当的好,它还有一些增值服务(付费插件),最好用的就是powerpaste,非常的强大,支持从 word 里面复制各种东西,而且还帮你顺带格式化了.

07.LoT.UI 前后台通用框架分解系列之——轻巧的文本编辑器

LoT.UI汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui 上次说的是强大的百度编辑器 http://www.cnblogs.com/dunitian/p/5551701.html 这次说下简洁版而又不失功能的WangEditor 先看看效果基本上常用功能都有了,下面说下完整的demo: 前端案例: <!DOCTYPE html> <html> <head> <meta http-equiv=&qu

Email系列（QQ邮箱 + 含附件的邮箱案例 + 项目实战）

平台之大势何人能挡? 带着你的Net飞奔吧! http://www.cnblogs.com/dunitian/p/4822808.html 邮箱系列:https://github.com/dunitian/LoTCodeBase/tree/master/NetCode/3.常用技能/07.Email 1.QQ邮箱: 他生成的是:http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=7oKBmoqAmq6fn8CNgYM 后来我把后面加密字符串

从零开始，搭建博客系统MVC5+EF6搭建框架（4）下，前后台布局实现、发布博客以及展示。

一.博客系统进度回顾目前已经完成了,前台展示,以及后台发布的功能,最近都在做这个,其实我在国庆的时候就可以弄完的,但是每天自己弄,突然最后国庆2天,连电脑都不想碰,所以就一直拖着,上一篇写了前端实现用到的一些WebUI框架以及一些系统中用到的js插件,其实写了这么久,还是第一次,有人留言,不要烂尾的,感觉还是有点点价值的,至少有人关注. 废话不多说,现在开始上代码. 二.博客系统后台布局实现 2.1.这里所用的是MVC的布局页来实现的,后台主要分为三部分:导航.菜单.主要内容代码实现: 这里

极极极极极简的的增删查改（CRUD）解决方案

去年这个时候写过一篇全自动数据表格的文章http://www.cnblogs.com/liuyh/p/5747331.html.文章对自己写的一个js组件做了个概述,很多人把它当作了一款功能相似的纯前端表格组件,然而这并不是我的初衷,我的本意是让后台系统的开发从重复的增删查改中脱离出来,我想即使不使用代码生成器也能做到极快速的开发.它不是优秀的表格组件,而是一个极简的增删查改解决方案. 为什么不使用现有的表格组件成熟的表格组件有很多,功能强大的也有不少.它们都大大减少了我们的工作量,那么为

laravel简书(1)

Laravel的社区生态中文社区(http://laravel-china.org) 5.4中文文档(http://d.laravel-china.org/docs/5.4) Laravel源码地址(http://github.com/laravel/laravel) 数据填充包(http://github.com/fzaninotto/Faker) 与其他框架的优势 1.laravel包含的功能更为丰富:队列,搜索,数据库迁移,定时脚本 2.laravel使用了丰富的第三方包 Laravel

abp 中wangEditor-angular 的使用

主要是上传图片的配置. (function () { if (typeof angular === 'undefined') { return; } angular.module('editorContainer', []) //.constant('uiBsEditor', { uiEditor: {} }).directive('contenteditable', function () { return { restrict: 'A', //scope:true, //scope: { '

tui-editor 和 wangeditor

热门专题