- 浏览: 497110 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (339)
- C# (2)
- Java集合 (7)
- Java设计模式 (15)
- Java基础 (31)
- Java-Spring (7)
- Java-Spring AOP (9)
- Java-Spring Transaction (6)
- Java-Hibernate (13)
- Jsp (7)
- JSTL (2)
- 加密解密 (13)
- sql (3)
- 数据库技术 (7)
- JQuery (2)
- css (3)
- JavaScript (19)
- Linux (34)
- 项目管理 (5)
- Tomcat (5)
- Oracle (4)
- axis2 (5)
- Linux c/c++ (40)
- Linux 防火墙及抓包分析 (10)
- Linux 环境配置 (3)
- Linux 高级命令 (14)
- Linux Server 配置 (9)
- c++ 内存管理 (4)
- JUnit (1)
- SSL 通信 (2)
- windows 系统调试 (8)
- 字符串处理 (8)
- 排序算法 (7)
- ACE (1)
- IT技术 (1)
- 敏捷开发 (1)
- TCPIP (4)
- 汇编语言 (7)
- STL (2)
- Struts (1)
- iBatis (3)
- 音视频开发 (2)
- Java多线程 (3)
- 架构设计 (2)
- Java网络编程 (1)
- Ubantu (0)
- Eclipse (2)
最新评论
-
df270464278:
请问博主有遇到中文乱码的问题吗?就是json字符串里面包含中文 ...
cur发送json字符串, post 请求 -
ykbj117:
你们知道刘绍华么?就是北邮的一个教授,专门研究WebRTC的资 ...
WebRTC -
隐形的翅膀:
不会用powershell
去除SVN标志 -
lengbamboo:
改注册表比较危险,给个powershell的脚本:powers ...
去除SVN标志 -
hedong56:
[/b][b][i][/i][u][/u][flash=20 ...
JAVASCRIPT定义对象的四种方式
添加去除Tool Bar
extended_valid_elements and invalid_elements
editor_selector and editor_deselector
Multiple configs/inits
Ajax load/save
readonly
URL config example
Custom toolbar button example
SOME JQUERY API
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "advanced" }); function toggleEditor(id) { if (!tinyMCE.get(id)) tinyMCE.execCommand('mceAddControl', false, id); else tinyMCE.execCommand('mceRemoveControl', false, id); } </script> <form method="post" action="somepage"> <textarea name="content" style="width:100%"> </textarea> </form> <a href="javascript:toggleEditor('content');">Add/Remove editor</a>
extended_valid_elements and invalid_elements
<script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "simple", extended_valid_elements : "img[class=myclass|!src|border:0|alt|title|width|height]", invalid_elements : "strong,b,em,i" }); </script>
editor_selector and editor_deselector
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "simple", editor_selector : "mceEditor", editor_deselector : "mceNoEditor" }); </script> <form method="post" action="somepage"> <textarea id="content1" name="content1" class="mceEditor" cols="85" rows="10">This will be a editor, since it has a selector class.</textarea> <textarea id="content2" name="content2" class="mceEditor" cols="85" rows="10">This will be a editor, since it has a selector class.</textarea> <textarea id="content3" name="content3" class="mceNoEditor" cols="85" rows="10">This is not a editor since it has a deselector class.</textarea> </form>
Multiple configs/inits
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "simple", editor_selector : "mceSimple" }); tinyMCE.init({ mode : "textareas", theme : "advanced", editor_selector : "mceAdvanced" }); </script> <form method="post" action="somepage"> <textarea name="content1" class="mceSimple" style="width:100%"> </textarea> <textarea name="content2" class="mceAdvanced" style="width:100%"> </textarea> </form>
Ajax load/save
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "advanced" }); function ajaxLoad() { var ed = tinyMCE.get('content'); // Do you ajax call here, window.setTimeout fakes ajax call ed.setProgressState(1); // Show progress window.setTimeout(function() { ed.setProgressState(0); // Hide progress ed.setContent('HTML content that got passed from server.'); }, 3000); } function ajaxSave() { var ed = tinyMCE.get('content'); // Do you ajax call here, window.setTimeout fakes ajax call ed.setProgressState(1); // Show progress window.setTimeout(function() { ed.setProgressState(0); // Hide progress alert(ed.getContent()); }, 3000); } </script> <form method="post" action="somepage"> <textarea name="content" style="width:100%"> </textarea> </form>
readonly
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "advanced", readonly : true }); </script> <form method="post" action="somepage"> <textarea name="content" style="width:100%"> </textarea> </form>
URL config example
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "exact", elements : 'absurls', theme : "advanced", plugins : 'advlink,advimage', relative_urls : false }); tinyMCE.init({ mode : "exact", elements : 'abshosturls', theme : "advanced", plugins : 'advlink,advimage', relative_urls : false, remove_script_host : false }); tinyMCE.init({ mode : "exact", elements : 'relurls', theme : "advanced", plugins : 'advlink,advimage', relative_urls : true // Default value }); tinyMCE.init({ mode : "exact", elements : 'relurlstopage', theme : "advanced", plugins : 'advlink,advimage', relative_urls : true, // Default value document_base_url : 'http://tinymce.moxiecode.com/' }); tinyMCE.init({ mode : "exact", elements : 'nourlconvert', theme : "advanced", plugins : 'advlink,advimage', convert_urls : false }); </script> <form method="post" action="somepage"> <h2>TinyMCE with absolute URLs on links and images</h2> <textarea id="absurls" name="absurls" cols="85" rows="10"></textarea> <h2>TinyMCE with absolute URLs and including domain on links and images</h2> <textarea id="abshosturls" name="abshosturls" cols="85" rows="10"></textarea> <h2>TinyMCE with relative URLs on links and images</h2> <textarea id="relurls" name="relurls" cols="85" rows="10"></textarea> <h2>TinyMCE with relative URLs on links and images to a specific page</h2> <textarea id="relurlstopage" name="relurlstopage" cols="85" rows="10"></textarea> <h2>TinyMCE with no url convertion</h2> <textarea id="nourlconvert" name="nourlconvert" cols="85" rows="10"></textarea> </form>
Custom toolbar button example
<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "advanced", theme_advanced_buttons1 : "mybutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright, justifyfull,bullist,numlist,undo,redo,link,unlink", theme_advanced_buttons2 : "", theme_advanced_buttons3 : "", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", plugins : 'inlinepopups', setup : function(ed) { // Add a custom button ed.addButton('mybutton', { title : 'My button', image : 'img/example.gif', onclick : function() { // Add you own code to execute something on click ed.focus(); ed.selection.setContent('<STRONG>Hello world!</STRONG>'); } }); } }); </script> <form method="post" action="somepage"> <textarea name="content" style="width:100%"> </textarea> </form>
SOME JQUERY API
<form method="post" action="somepage"> <textarea id="content" name="content" class="tinymce" style="width:100%"> </textarea> <!-- Some integration calls --> <a href="javascript:;" onmousedown="$('#content').tinymce().show();">[Show]</a> <a href="javascript:;" onmousedown="$('#content').tinymce().hide();">[Hide]</a> <a href="javascript:;" onmousedown="$('#content').tinymce().execCommand('Bold');">[Bold]</a> <a href="javascript:;" onmousedown="alert($('#content').html());">[Get contents]</a> <a href="javascript:;" onmousedown="alert($('#content').tinymce().selection.getContent());">[Get selected HTML]</a> <a href="javascript:;" onmousedown="alert($('#content').tinymce().selection.getContent({format : 'text'}));">[Get selected text]</a> <a href="javascript:;" onmousedown="alert($('#content').tinymce().selection.getNode().nodeName);">[Get selected element]</a> <a href="javascript:;" onmousedown="$('#content').tinymce().execCommand('mceInsertContent',false,'<b>Hello world!!</b>');">[Insert HTML]</a> <a href="javascript:;" onmousedown="$('#content').tinymce().execCommand('mceReplaceContent',false,'<b>{$selection}</b>');">[Replace selection]</a> </form>
发表评论
-
Java Script 闭包
2014-11-14 20:46 722Javascript闭包就是在另一个作用域中保存了一份它从上一 ... -
dojo 的压缩
2012-03-26 17:06 12941. 命令 build.bat profile=foo ac ... -
JavaScript Compress
2011-06-14 15:58 9861. YUI java -jar yuicompress.j ... -
apply 使用的一个例子
2010-11-17 09:25 1046<html> <head> & ... -
Google 地图的一些资料
2010-11-17 09:22 991国内一个google map api 开发者的博客 http: ... -
JQuery 对一些特殊HTML元素的操作
2010-11-17 09:12 10591. $("#select_id").ch ... -
javascript compress
2010-10-08 15:51 10451. packer 2. dojo 3. ie 内存泄露探 ... -
扩展Jquery
2010-08-20 15:59 10721. 为jQuery添加全局函数 jQuery ... -
JavaScript 实现事件的广播,并让各个对象执行事件
2010-07-30 15:32 1744<html> <head> & ... -
在浏览器中使用flash 存储客户端数据
2010-07-28 11:05 13311. example 1 jStore fla ... -
IE中使用firebug
2010-07-19 09:09 11681. IE 中使用FireBug 在页面中引入 firbug ... -
javascript 正则表达式应用两例
2010-05-13 10:19 1299Javascript 正则表达式 1. test reg ... -
tinymce 应用四---为tinymce添加一个plugin
2010-04-21 16:33 7778如何为TinyMce写一个插件 1. 目录切换到tiny_m ... -
tinymce 应用 三
2010-02-21 14:34 1847在ToolBar上添加一个listbox <scri ... -
tinymce 应用 二
2010-02-21 14:07 1812在源代码编辑器和所见即所得编辑器之间进行切换 <fo ... -
不同浏览器的JavaScript 常见问题
2009-11-25 15:28 10731. 在ie6下点a标签不会submit,原来在a的href上 ... -
JavaScript 对象实现继承的几种方式
2009-05-26 11:12 2566先定义一个对象classA,我们要实现一个新对象,继承clas ... -
JAVASCRIPT定义对象的四种方式
2009-05-25 11:05 2100先写一个函数,下面几个方式会用到 function sho ...
相关推荐
《TinyMCE应用四——为TinyMCE添加一个Plugin》 TinyMCE是一款强大的富文本编辑器,广泛应用于网页内容编辑、CMS系统等场景。它提供了丰富的API和自定义插件功能,允许开发者根据需求定制功能。在本篇中,我们将...
TinyMCE是一款强大的所见即所得(WYSIWYG)富文本编辑器,广泛应用于网页内容编辑、CMS系统以及各种在线应用中。它提供了丰富的功能,包括文本格式化、图片处理、链接插入等,同时也支持自定义插件和主题,以满足...
TinyMCE 4.7.5 是一个流行的开源富文本编辑器,被广泛应用于网站建设和内容管理系统中。这个版本的 TinyMCE 提供了丰富的文本编辑功能,支持Vue.js框架的集成,使得在Web应用中实现高度定制化的文本编辑体验变得容易...
TinyMCE是一款开源的JavaScript富文本编辑器,被广泛应用于网页和Web应用程序中,提供类似Microsoft Word的编辑体验。用户可以创建、编辑和格式化文本,插入图片、链接等元素,同时支持自定义配置和扩展。 ...
TinyMCE是一个强大的...总的来说,TinyMCE PowerPaste插件通过提供高级的粘贴功能,极大地提升了用户在TinyMCE编辑器中的体验,特别是对于那些经常需要从其他文档应用中复制内容的用户来说,这是一个非常实用的工具。
Tinymce 是一款非常流行的开源富文本编辑器,广泛应用于网页内容编辑,尤其在JavaScript项目中被大量使用。它提供了丰富的功能,包括文字格式化、图片上传、链接插入等,使得用户可以像在Word中一样方便地编辑网页...
TinyMCE是一款强大的所见即所得(WYSIWYG)文本编辑器,广泛应用于网页内容编辑、CMS系统和各种应用程序中。它提供了丰富的API和插件系统,使得开发者可以定制编辑器的功能,以满足特定需求。在这个场景中,我们将...
在提供的 "tinymce_powerpaste-master" 压缩包中,通常会包含一个演示(Demo)文件或文件夹,它展示了 Powerpaste 在实际应用中的工作方式。你可以通过运行这个 Demo 来了解如何在 Tinymce 中安装和配置 Powerpaste ...
TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的...最重要的是,TinyMCE是一个根据LGPL license发布的自由软件,你可以把它用于商业应用。本站采用的就是TinyMCE编辑器,下图是此编辑器的界面。
【tinymce】是一款知名的富文本编辑器,广泛应用于网页内容编辑和管理,为用户提供类似Microsoft Word的界面和功能,使得非编程人员也能轻松编辑和格式化网页内容。它支持多种语言,包括中文,并且拥有丰富的插件...
TinyMCE是一款功能强大的开源富文本编辑器,广泛应用于网页和各种应用程序中,提供丰富的文本格式化、图像处理和交互功能。针对用户在从Microsoft Word等文档处理软件中复制粘贴内容时希望保留原有格式和图片的需求...
tinyMCE是一款非常流行的开源富文本编辑器,广泛应用于各种网站和应用程序中。它提供了丰富的文本编辑功能,包括但不限于格式化文本、插入图像、链接等。在某些场景下,用户可能需要实时预览他们上传的图片,而无需...
在Vue3中集成TinyMCE是一个常见的需求,特别是在构建富文本编辑器场景下。TinyMCE是一个功能强大的JavaScript WYSIWYG(所见即所得)编辑器,它提供了丰富的文本格式化选项,使得用户可以方便地创建和编辑HTML内容。...
TinyMCE是一款强大的开源富文本编辑器,广泛应用于网页内容编辑和内容管理系统中。这个官方包,正如其标签所示,是TinyMCE的3.0版本。TinyMCE以其轻量级、高度可定制和兼容多种浏览器的特点,在Web开发领域备受青睐...
Tinymce是一款广泛应用于Web开发领域的开源富文本编辑器,它以其强大的功能和良好的用户体验而备受开发者喜爱。在“tinymce4.7.5”这个压缩包中,包含了Tinymce的特定版本——4.7.5的所有静态资源文件,这些文件使得...
TinyMCE是一款强大的富文本编辑器,广泛应用于网页和应用程序中,允许用户创建和编辑具有丰富格式的内容。它提供了丰富的API和插件,使得开发者能够定制编辑器功能以满足特定需求。在本教程中,我们将深入探讨如何在...
TinyMCE是一款强大的开源富文本编辑器,广泛应用于网页内容编辑和内容管理系统中。这个"tinymce3官方英文语言包en"是针对TinyMCE 3.x版本的一个关键组件,它包含了编辑器用户界面的所有英文语言字符串。这个语言包...
TinyMCE是一款强大的开源富文本编辑器,广泛应用于网页内容编辑和内容管理系统中。它提供了丰富的功能和插件,使得用户可以轻松创建和编辑复杂的文本格式。本文将深入讲解TinyMCE中的“格式刷”(Format Painter)...
TinyMCE是一款强大的开源富文本编辑器,广泛应用于网页内容编辑和内容管理系统中。这个"TinyMCE富文本编辑器资源包"包含了TinyMCE的最新版本——版本6的相关资源,旨在提供一个功能完备、易用且高度可定制的文本编辑...
富文本编辑器在Web开发中扮演着至关重要的角色,它为用户提供了一种便捷的...结合其强大的API和丰富的插件系统,TinyMCE可以适应各种各样的应用场景,无论是简单的博客编辑,还是复杂的在线文档协作,都能游刃有余。