[转]TinyMCE(富文本编辑器)在Asp.Net中的使用方法

  

from:http://tangb4c.yo2.cn/archives/633878

04月 22nd, 2008

现在做网页,用FCKEditor用得比较多,它的实现原理是在要加入FCKEditor的地方加入一个iframe,并将其src指向FCKeditor/editor/fckeditor.html?InstanceName=commodityBrief&Toolbar=Default,至于后面的参数,根据情况不同,参数传递得不一样,然后里面用Table来实现顶部的工具栏,接着下面再用一个iframe,src指向fckblank.html,来实现编辑区。

 

 

整体上显得有些臃肿。于是找了找其它的HTML编辑器,大概有FreeTextBox,TinyMCE,这里要介绍的就是TinyMCE。这是一款基于JS的编辑器,网方介绍如下:

TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control released as Open Source under LGPL by Moxiecode Systems AB. It has the ability to convert HTML TEXTAREA fields or other HTML elements to editor instances. TinyMCE is very easy to integrate into other Content Management Systems.

 

优点(我的第一印象):

  1. 生成的代码简洁,默认皮肤简单明了;
  2. 在Asp.Net中使用方便,无须太多设置。

在Asp.Net中的使用方法其实挺简单的,不过就琢磨这个,花了大概1~2个小时的时间,所以在这里写下来,以帮助遇到同样问题的人

从官方网站下载TinyMCE(http://tinymce.moxiecode.com/download.php),然后将里面的jscripts目录拷到你的网站目录

假设你的a.aspx页面中,某一个地方需要用到编辑器,则在此位置加入

<asp:TextBox ID=”brand” TextMode=”MultiLine” runat=”server” />

并同时在header里加入:

<script src=”../js/tiny_mce/tiny_mce_src.js” type=”text/javascript”></script>
<script language=”javascript” type=”text/javascript”>
    tinyMCE.init({
    mode : “textareas”,
    theme : “simple”
    });
</script>

运行页面,即可以看到一个编辑器出现了,并且你在服务端可以通过brand.Text来获取值(你可能会看到一个出错的提示,这时只需要将.aspx最开始的<%@ Page 里加入ValidateRequest=”false”,即可)

当然,如果你页面中有多个textareas,你可能只希望某一个用编辑器代替,则上面的mode一行改为:

mode : "exact",elements : “对应的ID”
需要其它的用法,可以到官方网站查看
----------------------------------------------------------------
相关资源收集:
TinyMCE 中文手册 
tinymce中几个比较有用的插件:  
 
tinymce中文字体过小解决方法   
 
时间: 2024-10-25 22:05:12

[转]TinyMCE(富文本编辑器)在Asp.Net中的使用方法的相关文章

ThinkPHP自动转义存储富文本编辑器内容导致读取出错的解决方法_php技巧

ThinkPHP的conf文件中的Convention.php有一个配置选项 'DEFAULT_FILTER'        =>  'htmlspecialchars', // 默认参数过滤方法 用于I函数... 默认这个方法是开启的.也就是说,我们往数据库里面存储的数据中都会经过htmlspecialchars这个函数的转义处理. 我在我的项目中使用了Kindeditor富文本编辑器(或许你使用的是Ueditor\ckeditor),通过富文本编辑器编辑文章的内容然后存储到数据库中,再从数据

百度Web富文本编辑器ueditor在ASP.NET MVC3项目中的使用说明

  ======================================================================   [百度Web富文本编辑器ueditor在ASP.NET MVC3项目中的使用说明]                                         ----by 夏春涛 2014-02-20   =====================================================================

富文本编辑器-导入百度编辑器的问题

问题描述 导入百度编辑器的问题 jsp 中导入百度编辑器没有达到需要的效果,只有一个小小的编辑框,没有可视化按钮,没有提交按钮,就那样放在左上角,下面就是显示的结果,,怎么破???? 解决方案 百度编辑器路径设置问题 解决方案二: 跟你个我以前的写的案例,你修改一下吧 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String pa

web 富文本编辑器总结

前言 富文本编辑器,就是除了能输入不同的文本之外,还可以之间粘贴图画等其他的多媒体信息.也可说是所见即所得的编辑器. 目前可以使用的编辑器有很多, 在网络上有找到这样一份比较表格: 编辑器 产地 稳定 是否 轻量 技术 支持 主要优点 主要不足 Ver 速度 肥瘦 (MB) CKEditor 国外老牌 稳定 否 团队 功能强大,稳定 臃肿,加载慢 3.6 4 0.90 KindEditor 国产(上海-浩跃软件)   轻量   插件扩展   4.0 2 0.24 xhEditor 国产(台州-[

求高手kindeditor富文本编辑器,使用源码及详解,谢谢各位,急,急,急,急,急急

问题描述 求高手kindeditor富文本编辑器,使用源码及详解,谢谢各位,急,急,急,急,急急 求高手kindeditor富文本编辑器,使用源码及详解,谢谢各位,急,急,急,急,急急 解决方案 参考:http://blog.csdn.net/thinkhlin_down/article/details/6065619http://www.poluoluo.com/jzxy/201306/214700.htmlhttp://cshbbrain.iteye.com/blog/1892698 解决方

iOS使用UITableView实现的富文本编辑器

本文讲的是iOS使用UITableView实现的富文本编辑器,公司最近做一个项目,其中有一个模块是富文本编辑模块,之前没做个类似的功能模块,本来以为这个功能很常见应该会有已经造好的轮子,或许我只要找到轮子,研究下轮子,然后修改打磨轮子,这件事就八九不离十了.不过,还是 too young to simple 了,有些事,还是得自己去面对的,或许这就叫做成长,感觉最近一年,对于编程这件事,更多了一点热爱,我感觉我不配过只会复制粘贴代码的人生,编程需要有挑战.所以,遇到困难,保持一份正念,路其实就在

jquery-bootstrap 富文本编辑器可以上传附件么?有没有可以上传附件的富文本编辑器

问题描述 bootstrap 富文本编辑器可以上传附件么?有没有可以上传附件的富文本编辑器 我看大多富文本编辑器只能上传图片或者视频,但有没有带上传附件的 解决方案 http://blog.csdn.net/zcs_123li/article/details/51220351

生成富文本编辑器生成内容转换成json格式,解析出错,在mysql里面用什么类型保存

问题描述 生成富文本编辑器生成内容转换成json格式,解析出错,在mysql里面用什么类型保存 富文本怎么保存?保存在mysql里面用什么样的类型,还有就是能够获取到富文本的内容(包括标签什么的),用json怎么转换,用过转义也不行?求助啊!!!!

手机端--富文本编辑器

问题描述 各位大神,手机端想弄一个富文本编辑器,有没有好的推荐:不是安卓...是基于浏览器的[有过成功经验的大虾,给点提示,,,谢谢] 解决方案 解决方案二:先从业务角度把东西想明白.在手机上弄一个Html编辑器,进行十几.二十几项编辑,如何操作?用手指头吗?先把这个业务设计出来,才好找实现.解决方案三:需求挺逗解决方案四: 解决方案五:楼上更逗,人家需求怎么就逗了?手机端富文本编辑器很多场景都有需求解决方案六:百度的富文本编辑器ueditor,之前用了还不错.解决方案七:没看清是手机端使用.手