关键词:
前言
配置.net mvc4项目使用ueditor编辑器,在配置过程中遇见了好几个问题,以此来记录解决办法。编辑器可以到http://ueditor.baidu.com/website/download.html#ueditor处下载.net 的开发包,如下图,我下载的是1.2.6.1net版本的开发包。
配置:
1、将开发包放到mvc4项目中,在我的项目中我放到了Content目录下
2、在模板页中引入js和样式文件:
3、在页面中配置初始化编辑器,在页面中配置textarea显示为编辑器,编辑器更多的参数设置可参考ueditor.config.js里面的配置说明:
@using(Html.BeginForm()){ <textarea id="editor" name="editor"> </textarea> <input type="submit" value="提交" /> } @section scripts{ <script type="text/javascript"> var editor = new baidu.editor.ui.Editor({ UEDITOR_HOME_URL: ‘/Content/ueditor/‘,//配置编辑器路径 iframeCssUrl: ‘/Content/ueditor/themes/iframe.css‘,//样式路径 initialContent: ‘欢迎使用ueditor‘,//初始化编辑器内容 autoHeightEnabled: true,//高度自动增长 minFrameHeight:500//最小高度 }); editor.render(‘editor‘); </script> }
到这一步正常情况下,页面已经显示出编辑器的样子了,如图:
4、解决图片上传问题,通过查看ueditor的配置文件及imageUp.ashx很明显的可以发现编辑器会把图片放到uditor/net/upload或upload1文件夹,若不存在则创建文件夹,此时上传图片会出现网络连接错误的提示,通过F12查看错误如图
查看Uploader文件默认属性为编译,将其属性改为内容以后重新运行程序,图片上传成功,如下图:
5、解决表单提交错误提示问题,从.Net Framework 4.0 开始,ASP.NET开始强制检测Request参数安全,直接提交会出现如下错误,
这个问题在后台action标记[ValidateInput(false)]来解决,如图:
6、编辑器等内容我们可以通过FormCollection来接收,从而实现内容保存,处理图片等相关操作
以上是百度编辑器在mvc项目中的简单配置,个人感觉还是很好用的,已经在多个项目中使用了,没有感觉像很多人说的那样不好使,个人反而感觉不错。
百度富文本编辑器ueditor自定义上传图片接口
如下图: 然后修改ueditor.all.js 查看详情
jfinal整合百度富文本编辑器ueditor
ueditor配置文件ueditor.config.js修改参数serverUrl:(改为要调用的controller)后台添加该路由指定的controllerpackagecom.sandu.mega.admin.ueditor;importcom.jfinal.aop.Clear;importcom.jfinal.core.Controller;importcom.jfinal.kit.Ret 查看详情
百度富文本编辑器ueditor
前言 配置.netmvc4项目使用ueditor编辑器,在配置过程中遇见了好几个问题,以此来记录解决办法。编辑器可以到http://ueditor.baidu.com/website/download.html#ueditor处下载.net的开发包,如下图,我下载的是1.2.6.1net版本的开发包。配置:1... 查看详情
百度富文本编辑器
...------------------------------------百度搜索—— 百度富文本编辑器——进入首页(百度编辑器-UEditor-首页)百度编辑器 -UEditor-首页 ——上方导航【下载】——选择对应的版本下载(我选的是1.4.3.3.Net版本utf-8版)【把资源... 查看详情
百度富文本编辑器ueditor添加到pom(代码片段)
.../lib/ueditor-1.1.2.jar</systemPath></dependency>由于富文本编辑器的地址相对性,我们发布项目的时候不能将ueditor的jar包放在私服中,会提示找不到该路径。所以,将该jar包放在项目中。 查看详情
springboot整合百度ueditor富文本
...供的demo和js导入项目中 2.编写html 这步创建好了编辑器然后我们会发现图片不能上传 出现这个问题之后我们去config.j 查看详情
百度富文本编辑器的使用(代码片段)
百度富文本编辑器的使用(2016年版本)对于大文章的网上编辑,你的输入编辑框肯定不够用,现在看看功能强大的富文本编辑框吧1.ueditor官方地址:http://ueditor.baidu.com/website/index.html 开发文档地址: http://ueditor.b... 查看详情
百度的富文本编辑器ueditor兼容问题
...是在IE7下就遇到问题了,如下图所示:做项目很需要这样的编辑器,可又得考虑到兼容性,这怎么办?Ueditor1.4.3以上版本将不再承诺支持ie6/ie7,如果一定要支持IE6/7所以只好下载1.4.2版本试一下了。追问可我用的就是1.4.2的追答那就再找... 查看详情
解决百度富文本编辑器ueditor插入视频后没有路径的问题
...bsp;Updateueditor.config.js文件中,xssFilter导致插入视频异常,编辑器在切换源码的过程中过滤掉img的_url属性(用来存储视频url)_src/plugins/video.js里处理的是_url,而不是_src。修改ueditor.config.js:img: [‘src‘,‘alt‘,‘title‘,‘... 查看详情
tp5-百度富文本编辑器
....config.js ueditor.all.min.js lang/zh-cn/zh-cn.js4、编辑器显示处加 id="content"3、底部 <scripttype="text/javascript 查看详情
百度的富文本编辑器ueditor添加图片自动加上宽度和高度的属性
若是没有对编辑器做任何配置直接添加图片的话,显示的html内容如下图所示:它会显示出原图片尺寸所以必须要对图片的初始显示尺寸做控制:ueditor文件中找到image.js文件在image.js中找到如下图所示:在此处添加上所要想显示的... 查看详情
在网站中使用ueditor富文本编辑器
...tor是由百度WEB前端研发部开发的所见即所得的开源富文本编辑器,具有轻量、可定制、用户体验优秀等特点。官网链接进入到下载页面,选择相应的版本下载这里我们使用ASP.NET开发,所以选择.NET版本。将文件解压后,目录结构... 查看详情
ueditor1.4.3.3富文本编辑器在图片不显示问题
...告,于是乎百度了一下找到一个百度的ueditor 富文本编辑器,由于帮助文档相比而言比较容易看懂,所以就选用了这个,但是也遇到了一些问题 好了 不废话 直接上代码:此项目是javaEE 项目 首先在 ... 查看详情
百度富文本赋值
$(function(){ varcontent=$(‘#daily_content‘).val(); //判断ueditor编辑器是否创建成功 ue.addListener("ready",function(){ //editor准备好之后才可以使用 ue.setContent(content); });}); 查看详情
springmvc怎么使用百度富文本编辑器
参考技术A上网查询了很多相关资料,此处简要记录下,防止以后遇到类似问题。一种方式是直接修改源码,步骤如下:1、编写controller如下(该接口是ueditor前后台交互的统一路径):packagecom.test.dcdp.controller;importjava.io.IOException;i... 查看详情
常用html富文本编辑器
常用的HTML富文本编译器UEditor、CKEditor、TinyMCE、HTMLArea、eWebEditor、KindEditor简介 这篇文章主要介绍了常用的HTML富文本编译器UEditor、CKEditor、TinyMCE、HTMLArea、eWebEditor、KindEditor简介,需要的朋友可以参考下 1、UEditorUEditor是由... 查看详情
django——xadmin中集成富文本编辑器ueditor(代码片段)
一、安装pip命令安装,由于ueditor为百度开发的一款富文本编辑框,现已停止维护,如果解释器为python2,则直接pipinstalldjangoueditor解压包安装,python3以上的版本需要下载压缩包解压安装下载地址步骤到下载地址下载并解压cmd进入... 查看详情
原关于百度富文本编辑器的使用心得
...的数据库中添加新字段,修改后台代码用创建更多ueditor编辑器的新实例(一个字段对应一个实例)。编辑时从数据库中取出数据到ueditor编辑器中这里要说的就是我在从数据库中取出内容到编辑器中踩过的坑 1.实例名.getContent... 查看详情