.NET UEditor使用方法说明

在页面引用


代码如下:

<script src="Ueditor/editor_all.js" type="text/javascript"></script>
<script src="Ueditor/editor_config.js" type="text/javascript"></script>
<link href="Ueditor/themes/default/ueditor.css" rel="stylesheet" type="text/css" />

在页面加载控件


代码如下:

<textarea id="txteditor" name="txteditor" runat="server" cols="20" rows="2">
<p>请输入商品介绍</p>
</textarea>
<script type="text/javascript">
var editor = new baidu.editor.ui.Editor();
editor.render('txteditor');

//1.2.4以后可以使用一下代码实例化编辑器
UE.getEditor('txteditor')

</script>
<br />
<br />
<input id="Submit1" type="submit" value="submit" />

这里用textarea用DIV也行 但是在后台复制的时候不用能用DIV这个问题搞了我好久，

官网说的用


代码如下:

<script type="text/plain" id="editor">

//从数据库中取出文章内容打印到此处
</script>

这个地方没搞
这里我只用的textarea
用POST提交 接收用Request.Form["txteditor"]
后台给UEditor赋值  this.txteditor.InnerText="";

注意你上传图片 文件视频 fileUp.ashx ，imageUp.ashx，scrawlUp.ashx 文件路径修改你自己的路径
 Assembly Src="~/Ueditor/net/Uploader.cs"

修改 editor_config.js文件 URL = window.UEDITOR_HOME_URL || "/UeditorDemo/Ueditor/"; 你的UEditor路径 UeditorDemo是我的网站名称

[1.2.4.0 .Net 版本] 可以直接写成 URL = window.UEDITOR_HOME_URL || "/Ueditor/";  //Ueditor 是你的Ueditor文件名称

web.config
<pages validateRequest="false" />
<httpRuntime requestValidationMode="2.0" />

赞 (0)

相关推荐

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

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

    最近在配置.net mvc4项目使用ueditor编辑器,在配置过程中遇见了好几个问题,以此来记录解决办法. 首先去这里下载 然后重名一下下载的文件夹为ueditor(想自己起名字也可以,不过配置文件就要改成一样的了,这里为了避免麻烦,就跟配置文件里的名字保持一致了) 然后根据自己需要放到项目中,我是这么放的 上面建的文件夹也是跟配置文件保持一致,并不是非要照着这么做,这里只是跟配置文件保持一致,可以根据自己需要修改配置文件,自己想怎么建都行,看看配置文件就明白了 config.json /*

  • ASP.NET中集成百度编辑器UEditor

    ASP.NET中集成百度编辑器UEditor

    0.ueditor简介 UEditor是由百度WEB前端研发部开发的所见即所得的开源富文本编辑器,具有轻量.可定制.用户体验优秀等特点.开源基于BSD协议,所有源代码在协议允许范围内可自由修改和使用. UEditor官网:http://ueditor.baidu.com/website/index.html UEditor官方文档地址: http://fex.baidu.com/ueditor/ 1.将ueditor包导入项目 将从官网上下载的开发包解压后包含到项目中 (注:最新的代码需要时基于

  • UEditor编辑器自定义上传图片或文件路径的修改方法

    使用ueditor编辑器,附件默认在ueditor/php/upload/,  我的附件地址是网站根目录下/data/upload/ ,需要修改ueditor如下: 第一步:打开php/config.php修改图片目录 复制代码 代码如下: return array( //图片目录    'imageSavePath' => array (        '../../../../data/upload'    ) ); 第二步:图片上传后去掉相对路径php/imageUp.php 复制代码 代

  • 关于UEditor编辑器远程图片上传失败的解决办法

    远程图片上传是个很有意思的东西,比如你从别的网站复制一段文件,如果文字中带有图片,编辑器会自动将图片提取出来,进行上传,从而不用担心远程图片失效后,自己本地也无法浏览. 通过检查,发现远程图片上传的操作页面是:getRemoteImage.php .打开后我们先配置 savePath ,因为不同用户使用,需要存放到不同的目录,以免混乱,也方便管理 修改后代码: 复制代码 代码如下: //远程抓取图片配置 if(isset($_SESSION['admin'])){ $myPath = 'http

  • ASP.NET百度Ueditor编辑器实现上传图片添加水印效果

    ASP.NET百度Ueditor编辑器实现上传图片添加水印效果

    前言 最近工作中遇到一个需求,是要实现asp.net百度ueditor图片上传添加水印的功能,通过查找相关的资料终于实现了,下面来给大家分享下实现的效果,文末给出了实例代码,大家可以参考学习,下面来一起学习学习吧. 效果图 首先来看下我们想要的功能界面,如果发觉这种效果不是你想要的,后面的内容就不用看了. 准备  从官网下载的Ueditor压缩包,我下载的是ueditor1_4_3-utf8-net 这个版本,下面的介绍是对这个版本而言的. 修改界面 先找到我们要添加"加水印[checkbox]

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

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

    第一步:找到ueditor.config.js文件中的toolbars数组,增加一个"hougelou"字符串,然后找到labelMap数组,对应着添加一个labelMap,用于鼠标移上按钮时的提示. 复制代码 代码如下: //工具栏上的所有的功能按钮和下拉框,可以在new编辑器的实例时选择自己需要的从新定义         , toolbars:[             ['fullscreen', 'source', '|', 'undo', 'redo', '|',      

  • .NET下为百度文本编辑器UEditor增加图片删除功能示例

    百度的这个编辑器,的确挺好,但也有些,让人不如意的,如每次更新,本来有功能给搞没了,旧版本的代码又不能直接拿过来组合用,对用户来很是不爽.今天下载了目前最新版1.2.5为版本看更新记录,主要是对表格做个修改,我下载用上,我靠,上传图片的删除功能给取消了.把旧版本的删除代码拿过来,不好使,还得我慢慢研究,闹心啊,闹心,折磨我半天. 1.首先修改服务器端ueditor\net下的文件imageManager.ashx,增加图片删除的处理.如下代码的Add部分所示: 复制代码 代码如下: <%@ We

  • 利用ASP.NET MVC+Bootstrap搭建个人博客之修复UEditor编辑时Bug(四)

    利用ASP.NET MVC+Bootstrap搭建个人博客之修复UEditor编辑时Bug(四)

    我的个人博客站在使用百度富文本编辑器UEditor修改文章时,遇到了一些问题,(不知是bug,还是我没有配置好).但总算找到了解决方法,在此记录下来. 小站首页文章列表显示为(显示去除HTML标签后的前600个字符): 具体在www.zynblog.com 遇到的问题: 正常来讲,进入文章修改页,只需将UEditor对应的textarea的value设置为文章Content就行了: $('#editor').val('@Html.Raw(this.Model.Contents)'); 最开始我就

  • ueditor编辑器不能上传图片问题的解决方法

    ueditor是百度编辑器,在本地的iis环境是可以上传图片了,但放在服务器的iis环境无法上传图片了,经过搜索发现是iis设置问题,引起这个问题的主要原因是,大多数虚拟主机不会给IIS匿名账号访问磁盘上的非用户目录,连读取的权限都没有,既然我们不能解决iis问题只有从代码设置了,具体如下. 在上传不了图片时,可以用浏览器的自带的调试工具查看报错,你可以看一个"拒绝访问或文件已存在"的错误.仔细调试分析,终于找到问题所在. 在它的upload.class.asp中,有如下一个函数: P

  • ThinkPHP使用Ueditor的方法详解

    本文实例讲述了ThinkPHP使用Ueditor的方法.分享给大家供大家参考,具体如下: 相信很多人现在还在用着FCkeditor,以前我也在用,可是后来发现百度的Ueditor之后,发现,Ueditor比Fckeditor更好看,操作性上也比Fckeditor好多了,所以还是尝试着使用ueditor,但是在ThinkPHP框架下使用ueditor还是遇到了一些问题,也花费了一些时间去解决这些问题,这样,在这里写一个关于ThinkPHP下使用ueditor的教程,给需要使用的人. 1.在网站的根

  • 免费开源百度编辑器(UEditor)使用方法

    免费开源百度编辑器(UEditor)使用方法

    UEditor效果图 一.简介 UEditor是一个开源免费的编辑器,由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于BSD协议,允许自由使用和修改代码. 官方网站:http://ueditor.baidu.com/ 二.下载地址 官方下载:http://ueditor.baidu.com/website/download.html 官网上下载完整源码包,解压到任意目录,解压后的源码目录结构如下所示:    _examples:编辑器完整版的

  • .NET UEditor使用方法说明

    在页面引用 复制代码 代码如下: <script src="Ueditor/editor_all.js" type="text/javascript"></script><script src="Ueditor/editor_config.js" type="text/javascript"></script><link href="Ueditor/themes/

  • vue集成百度UEditor富文本编辑器使用教程

    vue集成百度UEditor富文本编辑器使用教程

    在前端开发的项目中,难免会遇到需要在页面上集成一个富文本编辑器.那么,如果你有这个需求,希望可以帮助到你. vue是前端开发者所追捧的框架,简单易上手,但是基于vue的富文本编辑器大多数太过于精简.于是我将百度富文本编辑器放到vue项目中使用.效果图如下 废话不多说. 1.使用vue-cli构建一个vue项目.然后下载UEditor源码,地址 把项目复制到vue项目的static文件下.目的是让服务可以访问到里面的文件,打开UEditor目录文件.这里下载的是jsp版本的.文件名字没有更改过.打

  • Ueditor和CKeditor 两款编辑器的使用与配置方法

    Ueditor和CKeditor 两款编辑器的使用与配置方法

    一丶ueditor 百度编辑器 1.官方文档,演示,下载地址:http://ueditor.baidu.com/website/index.html 2.百度编辑器的好:Editor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点. 3.如果想定制你想要的编辑器功能:查看官方网站的下载页面即可. 4.编辑器展示: 5.百度编辑器配置. 1.载入js,css文件 <script src="ueditor/editor_config.js"

  • 百度UEditor编辑器使用教程与使用方法(图文)

    百度UEditor编辑器使用教程与使用方法(图文)

    我们在做网站的时候,网站后台系统一般都会用到web编辑器,今天笔者就给大家推荐一款百度UEditor编辑器.关于这款百度UEditor编辑器官网上也有简单的教程,不过看着比较费劲,今天笔者就跟大家分享一下百度UEditor编辑器使用教程与使用方法,希望对大家有所帮助. 第一:百度UEditor编辑器的官方下载地址 ueditor 官方地址:http://ueditor.baidu.com/website/index.html 开发文档地址:http://ueditor.baidu.com/web

  • UEditor 编辑器跨域上传解决方法

    解决的方法: 1.在 ueditor\dialogs\internal.js 加入 document.domain = '根域名'; 2.在当前页面同样指定根域名: 复制代码 代码如下: <script type="text/javascript">    document.domain = "根域名";</script> 这样在 chrome.firefox 下没有问题,但在 ie 下还需要简单修改下 UEditor,在 editor.js

  • ueditor 1.2.6 使用方法说明

    ueditor 1.2.6 使用方法说明

    本文以php版本为例:文件下载:http://ueditor.baidu.com/website/download.html还可以自己先定义内容,然后下载,这样可以帮助我们精简不少东西.以本地php环境为例,现在www目录下建立一个app目录作为测试目录,然后将下载的ueditor文件夹解压到app文件夹下. 然后,在app文件夹下建立一个index.php文件.然后输入以下代码: 复制代码 代码如下: <!DOCTYPE html><html><head><ti

  • webuploader模态框ueditor显示问题解决方法

    webuploader 模态框 ueditor 显示问题 模态框z-index 对应的值 .modal { z-index: 10050 !important; outline: none !important; } 遮罩层对应的z-index值 .modal-backdrop { border: 0 !important; outline: none !important; z-index: 10049 !important; } ueditor 插件中,默认的z-index值为900 : 在

  • thinkPHP下ueditor的使用方法详解

    本文实例讲述了thinkPHP下ueditor的使用方法.分享给大家供大家参考,具体如下: 1.首先需要下载ueditor,下载地址:http://ueditor.baidu.com/website/download.html 2.下载对应的php版的,下载后重命名为ueditor,根据需要放到对应的项目目录中.我放的位置为Public/admin文件夹下,admin为后台的访问入口文件目录. 3.在项目中的使用 首先需要引入核心的js文件: <script type="text/java

随机推荐