- 快速入门
- Explore advanced topics
- Accessibility
- Editor control identifiers
- Annotations
- Editor events
- tinymce-AddOnManager
- Boilerplate content CSS
- Handle asynchronous image uploads
- tinymce-Annotator
- tinymce-FocusEvent
- Configuring callbacks for Comments 2-0
- Keyboard shortcuts
- tinymce-CommandEvent
- tinymce-FocusManager
- tinymce-WindowManager
- Toolbar buttons
- PHP image upload handler
- tinymce-ContentEvent
- tinymce-Formatter
- tinymce-dom-DomQuery
- Create a plugin for TinyMCE
- Security
- tinymce-Editor
- tinymce-NotificationManager
- tinymce-dom-DOMUtils
- Create a skin for TinyMCE
- Usage with module loaders
- tinymce-EditorCommands
- tinymce-Plugin
- tinymce-dom-ScriptLoader
- Create custom notifications
- TinyMCE plugin Yeoman generator
- tinymce-EditorManager
- tinymce-ProgressStateEvent
- tinymce-dom-BookmarkManager
- Editor command identifiers
- tinymce-Formatter
- tinymce-EditorObservable
- tinymce-ResizeEvent
- tinymce-dom-ControlSelection
- tinymce
- tinymce-Env
- tinymce-Shortcuts
- tinymce-dom-DomQuery
- tinymce-Event
- tinymce-Theme
- tinymce-dom-DOMUtils
- tinymce-UndoManager
- tinymce-dom-EventUtils
- tinymce-dom-RangeUtils
- tinymce-dom-ScriptLoader
- tinymce-dom-Selection
- tinymce-html-Schema
- tinymce-dom-Serializer
- tinymce-html-Serializer
- tinymce-util-I18n
- tinymce-dom-TreeWalker
- tinymce-html-Styles
- tinymce-util-JSON
- Cloud deployment of plugins Only
- tinymce-editor-ui-registry
- tinymce-html-Writer
- tinymce-util-JSONRequest
- Version compatibility reference
- Image & file upload options
- tinymce-geom-Rect
- tinymce-util-LocalStorage
- Configuration options reference
- Integration and setup options
- tinymce-html-DomParser
- tinymce-util-Observable
- tinymce-util-Observable
- Advanced editing behaviors
- JWT authentication setup
- tinymce-html-Entities
- tinymce-util-URI
- tinymce-util-Tools
- Content appearance options
- Localization options
- tinymce-html-Node
- tinymce-util-Color
- tinymce-util-XHR
- Content filtering options
- Spelling options
- tinymce-html-SaxParser
- tinymce-util-Delay
- Cloud deployment guide
- Content formatting options
- URL handling options
- tinymce-util-EventDispatcher
- Cloud deployment of editor & plugins
- Contribute to documentation
- Examples & demos
- Specify editor & plugin versions
- Contribute to TinyMCE development
- Basic example
- User interface options
- Case Change
- Checklist plugin
- Classic editor example
- Comments 2-0 Demo
- Custom formats example
- Custom menu item
- HTML5 formats example
- Valid elements example
- Custom toolbar button
- Format Painter
- Live example
- Embed rich media
- Full featured example
- Premium features
- Configure Enhanced Media Embed Server
- Server-side component installation
- Custom toolbar menu button
- Image tools example
- Accessibility checking
- Integrate Enhanced Media Embed Server
- Configure server-side components
- Custom toolbar split button
- Inline editor example
- Advanced source code editing
- Format Painter
- Troubleshoot server-side components
- Tiny Drive
- Local upload
- Case Change
- Get TinyMCE bugs fixed
- Professional support
- Distraction-free editor example
- Page Embed plugin
- Checking links as-you-type
- Mentions
- System requirements
- Basic local file picker
- Permanent Pen plugin
- Check Spelling As-You-Type
- Self-hosted file management
- Commenting & collaboration
- URL conversion example
- Adding custom dictionaries
- Page Embed plugin
- Cloud-based file management
- Checklist plugin
- Paste from Word
- Introduction & getting started
- Permanent Pen Plugin
- Advanced installation choices
- Logo & attribution requirements
- Basic setup
- Customizing the editor UI
- TinyMCE distraction-free editing mode
- Filtering TinyMCE content
- Setup inline editing mode
- Rails integration
- Get Support & FAQ
- Work with plugins to extend TinyMCE
- React integration
- Advanced Code Editor plugin
- Localize TinyMCE
- Integrate with other projects
- TinyMCE for Swing integration
- Advanced List plugin
- Code plugin
- Use multiple TinyMCE instances in a single page
- Angular 2+ integration
- Vue integration
- Anchor plugin
- Code Sample plugin
- Check spelling in TinyMCE
- Angular 1 integration
- WordPress integration
- Autolink plugin
- Color Picker plugin
- System requirements
- Bootstrap integration
- Migrating from TinyMCE 4-x to TinyMCE 5-0-
- Autoresize plugin
- Comments 2-0
- Uploading images and files
- Dojo integration
- TinyMCE Mobile
- Autosave plugin
- TinyMCE classic editing mode
- jQuery integration
- BBCode plugin
- Context Menu plugin
- KnockoutJS integration
- Add plugins to TinyMCE
- Case Change
- Directionality plugin
- Accessibility Checker plugin
- Character Map plugin
- Drive plugin
- Checklist plugin
- Emoticons plugin
- Format Painter
- Full Page plugin
- Full Screen plugin
- Link Checker plugin
- Help plugin
- Lists plugin
- Paste plugin
- Horizontal Rule plugin
- Media plugin
- Permanent Pen Plugin
- Table plugin
- Image plugin
- Enhanced Media Embed plugin
- PowerPaste plugin
- Template plugin
- User interface components
- Image Tools plugin
- Mentions plugin
- Preview plugin
- Text Color plugin
- Autocompleter
- Import CSS plugin
- MoxieManager plugin
- Print plugin
- Text Pattern plugin
- Context forms
- Insert Date/Time plugin
- Nonbreaking Space plugin
- Quick Toolbar plugin
- Spell Checker Pro plugin
- Context menu
- Legacy Output plugin
- Noneditable plugin
- Save plugin
- Table of Contents plugin
- Context toolbar
- Link plugin
- Page Break plugin
- Search and Replace plugin
- Visual Blocks plugin
- Custom sidebar
- Page Embed plugin
- Spell Checker plugin
- Visual Characters plugin
- Dialog
- Tab Focus plugin
- Word Count plugin
- Dialog components
- Quick start
- Custom menu items
- Toolbar buttons
- Types of toolbar buttons
tinymce
Properties
name | type | summary | defined by |
---|---|---|---|
$ | tinymce.dom.DomQuery | Dom query instance. | tinymce |
DOM | tinymce.dom.DOMUtils | Global DOM instance. | tinymce |
PluginManager | tinymce.AddOnManager | Global PluginManager instance. | tinymce |
ScriptLoader | tinymce.dom.ScriptLoader | Global ScriptLoader instance. | tinymce |
ThemeManager | tinymce.AddOnManager | tinymce | |
activeEditor | tinymce.Editor | Currently active editor instance. | tinymce |
baseURI | tinymce.util.URI | Absolute baseURI for the installation path of TinyMCE. | tinymce |
baseURL | String | Base URL where the root directory if TinyMCE is located. | tinymce |
documentBaseURL | String | Document base URL where the current document is located. | tinymce |
editors | Object | Collection of editor instances. Deprecated use tinymce.get() instead. | tinymce |
i18n | Object | Collection of language pack data. | tinymce |
majorVersion | String | Major version of TinyMCE build. | tinymce |
minorVersion | String | Minor version of TinyMCE build. | tinymce |
releaseDate | String | Release date of TinyMCE build. | tinymce |
suffix | String | Current suffix to add to each plugin/theme that gets loaded for example ".min". | tinymce |
Methods
name | summary | defined by |
---|---|---|
add() | Adds an editor instance to the editor collection. This will also set it as the active editor. | tinymce |
addI18n() | Adds a language pack, this gets called by the loaded language files like en.js. | tinymce |
create() | Creates a class, subclass or static singleton. More details on this method can be found in the Wiki. | tinymce |
createEditor() | Creates an editor instance and adds it to the EditorManager collection. | tinymce |
createNS() | Creates a namespace on a specific object. | tinymce |
each() | Performs an iteration of all items in a collection such as an object or array. This method will execure the callback function for each item in the collection, if the callback returns false the iteration will terminate. The callback has the following format: cb(value, key_or_index). | tinymce |
execCommand() | Executes a specific command on the currently active editor. | tinymce |
explode() | Splits a string but removes the whitespace before and after each value. | tinymce |
fire() | Fires the specified event by name. Consult the event reference for more details on each event. | tinymce |
get() | Returns a editor instance by id. | tinymce |
grep() | Filters out items from the input array by calling the specified function for each item. If the function returns false the item will be excluded if it returns true it will be included. | tinymce |
hasEventListeners() | Returns true/false if the object has a event of the specified name. | tinymce |
inArray() | Returns an index of the item or -1 if item is not present in the array. | tinymce |
init() | Initializes a set of editors. This method will create editors based on various settings. | tinymce |
is() | Checks if a object is of a specific type for example an array. | tinymce |
isArray() | Returns true/false if the object is an array or not. | tinymce |
makeMap() | Makes a name/object map out of an array with names. | tinymce |
map() | Creates a new array by the return value of each iteration function call. This enables you to convert one array list into another. | tinymce |
off() | Unbinds an event listener to a specific event by name. Consult the event reference for more details on each event. | tinymce |
on() | Binds an event listener to a specific event by name. Consult the event reference for more details on each event. | tinymce |
once() | Bind the event callback and once it fires the callback is removed. Consult the event reference for more details on each event. | tinymce |
overrideDefaults() | Overrides the default settings for editor instances. | tinymce |
remove() | Removes a editor or editors form page. | tinymce |
resolve() | Resolves a string and returns the object from a specific structure. | tinymce |
setActive() | Sets the active editor instance and fires the deactivate/activate events. | tinymce |
toArray() | Converts the specified object into a real JavaScript array. | tinymce |
translate() | Translates the specified string using the language pack items. | tinymce |
triggerSave() | Calls the save method on all editor instances in the collection. This can be useful when a form is to be submitted. | tinymce |
trim() | Removes whitespace from the beginning and end of a string. | tinymce |
walk() | Executed the specified function for each item in a object tree. | tinymce |
Methods
add
add(editor:tinymce.Editor):tinymce.EditorAdds an editor instance to the editor collection. This will also set it as the active editor.
Parameters
- editor (tinymce.Editor) - Editor instance to add to the collection.
Return value
- tinymce.Editor - The same instance that got passed in.
addI18n
addI18n(code:String, items:Object)Adds a language pack, this gets called by the loaded language files like en.js.
Parameters
- code (String) - Optional language code.
- items (Object) - Name/value object with translations.
create
create(s:String, p:Object, root:Object)Creates a class, subclass or static singleton. More details on this method can be found in the Wiki.
Examples
// Creates a basic class
tinymce.create('tinymce.somepackage.SomeClass', {
SomeClass: function() {
// Class constructor
},
method: function() {
// Some method
}
});
// Creates a basic subclass class
tinymce.create('tinymce.somepackage.SomeSubClass:tinymce.somepackage.SomeClass', {
SomeSubClass: function() {
// Class constructor
this.parent(); // Call parent constructor
},
method: function() {
// Some method
this.parent(); // Call parent method
},
'static': {
staticMethod: function() {
// Static method
}
}
});
// Creates a singleton/static class
tinymce.create('static tinymce.somepackage.SomeSingletonClass', {
method: function() {
// Some method
}
});
Parameters
- s (String) - Class name, inheritance and prefix.
- p (Object) - Collection of methods to add to the class.
- root (Object) - Optional root object defaults to the global window object.
createEditor
createEditor(id:String, settings:Object):tinymce.EditorCreates an editor instance and adds it to the EditorManager collection.
Parameters
- id (String) - Instance id to use for editor.
- settings (Object) - Editor instance settings.
Return value
- tinymce.Editor - Editor instance that got created.
createNS
createNS(n:String, o:Object):ObjectCreates a namespace on a specific object.
Examples
// Create some namespace
tinymce.createNS('tinymce.somepackage.subpackage');
// Add a singleton
var tinymce.somepackage.subpackage.SomeSingleton = {
method: function() {
// Some method
}
};
Parameters
- n (String) - Namespace to create for example a.b.c.d.
- o (Object) - Optional object to add namespace to, defaults to window.
Return value
- Object - New namespace object the last item in path.
each
each(o:Object, cb:function, s:Object)Performs an iteration of all items in a collection such as an object or array. This method will execure the callback function for each item in the collection, if the callback returns false the iteration will terminate. The callback has the following format: cb(value, key_or_index).
Examples
// Iterate an array
tinymce.each([1,2,3], function(v, i) {
console.debug("Value: " + v + ", Index: " + i);
});
// Iterate an object
tinymce.each({a: 1, b: 2, c: 3], function(v, k) {
console.debug("Value: " + v + ", Key: " + k);
});
Parameters
- o (Object) - Collection to iterate.
- cb (function) - Callback function to execute for each item.
- s (Object) - Optional scope to execute the callback in.
execCommand
execCommand(cmd:String, ui:Boolean, value:String):BooleanExecutes a specific command on the currently active editor.
Parameters
- cmd (String) - Command to perform for example Bold.
- ui (Boolean) - Optional boolean state if a UI should be presented for the command or not.
- value (String) - Optional value parameter like for example an URL to a link.
Return value
- Boolean - true/false if the command was executed or not.
explode
explode(s:string, d:string)Splits a string but removes the whitespace before and after each value.
Examples
// Split a string into an array with a,b,c
var arr = tinymce.explode('a, b, c');
Parameters
- s (string) - String to split.
- d (string) - Delimiter to split by.
fire
fire(name:String, args:Object?, bubble:Boolean?):ObjectFires the specified event by name. Consult the event reference for more details on each event.
Examples
instance.fire('event', {...});
Parameters
- name (String) - Name of the event to fire.
- args (Object?) - Event arguments.
- bubble (Boolean?) - True/false if the event is to be bubbled.
Return value
- Object - Event args instance passed in.
get
get(id:String):tinymce.Editor, ArrayReturns a editor instance by id.
Examples
// Adds an onclick event to an editor by id
tinymce.get('mytextbox').on('click', function(e) {
ed.windowManager.alert('Hello world!');
});
// Adds an onclick event to an editor by index
tinymce.get(0).on('click', function(e) {
ed.windowManager.alert('Hello world!');
});
// Adds an onclick event to an editor by id (longer version)
tinymce.EditorManager.get('mytextbox').on('click', function(e) {
ed.windowManager.alert('Hello world!');
});
Parameters
- id (String) - Editor instance id or index to return.
Return value
- tinymce.Editor - Editor instance to return or array of editor instances.
- Array - Editor instance to return or array of editor instances.
grep
grep(a:Array, f:function):ArrayFilters out items from the input array by calling the specified function for each item. If the function returns false the item will be excluded if it returns true it will be included.
Examples
// Filter out some items, this will return an array with 4 and 5
var items = tinymce.grep([1,2,3,4,5], function(v) {return v > 3;});
Parameters
- a (Array) - Array of items to loop though.
- f (function) - Function to call for each item. Include/exclude depends on it's return value.
Return value
- Array - New array with values imported and filtered based in input.
hasEventListeners
hasEventListeners(name:String):BooleanReturns true/false if the object has a event of the specified name.
Parameters
- name (String) - Name of the event to check for.
Return value
- Boolean - true/false if the event exists or not.
inArray
inArray(item:any, arr:Array):NumberReturns an index of the item or -1 if item is not present in the array.
Parameters
- item (any) - Item to search for.
- arr (Array) - Array to search in.
Return value
- Number - index of the item or -1 if item was not found.
init
init(settings:Object):tinymce.util.PromiseInitializes a set of editors. This method will create editors based on various settings.
Examples
// Initializes a editor using the longer method
tinymce.EditorManager.init({
some_settings : 'some value'
});
// Initializes a editor instance using the shorter version and with a promise
tinymce.init({
some_settings : 'some value'
}).then(function(editors) {
...
});
Parameters
- settings (Object) - Settings object to be passed to each editor instance.
Return value
- tinymce.util.Promise - Promise that gets resolved with an array of editors when all editor instances are initialized.
is
is(obj:Object, type:string):BooleanChecks if a object is of a specific type for example an array.
Parameters
- obj (Object) - Object to check type of.
- type (string) - Optional type to check for.
Return value
- Boolean - true/false if the object is of the specified type.
isArray
isArray(obj:Object):booleanReturns true/false if the object is an array or not.
Parameters
- obj (Object) - Object to check.
Return value
- boolean - true/false state if the object is an array or not.
makeMap
makeMap(items:Array, delim:String, map:Object):ObjectMakes a name/object map out of an array with names.
Parameters
- items (Array) - Items to make map out of.
- delim (String) - Optional delimiter to split string by.
- map (Object) - Optional map to add items to.
Return value
- Object - Name/value map of items.
map
map(array:Array, callback:function):ArrayCreates a new array by the return value of each iteration function call. This enables you to convert one array list into another.
Parameters
- array (Array) - Array of items to iterate.
- callback (function) - Function to call for each item. It's return value will be the new value.
Return value
- Array - Array with new values based on function return values.
off
off(name:String?, callback:callback?):ObjectUnbinds an event listener to a specific event by name. Consult the event reference for more details on each event.
Examples
// Unbind specific callback
instance.off('event', handler);
// Unbind all listeners by name
instance.off('event');
// Unbind all events
instance.off();
Parameters
- name (String?) - Name of the event to unbind.
- callback (callback?) - Callback to unbind.
Return value
- Object - Current class instance.
on
on(name:String, callback:callback, first:Boolean):ObjectBinds an event listener to a specific event by name. Consult the event reference for more details on each event.
Examples
instance.on('event', function(e) {
// Callback logic
});
Parameters
- name (String) - Event name or space separated list of events to bind.
- callback (callback) - Callback to be executed when the event occurs.
- first (Boolean) - Optional flag if the event should be prepended. Use this with care.
Return value
- Object - Current class instance.
once
once(name:String, callback:callback):ObjectBind the event callback and once it fires the callback is removed. Consult the event reference for more details on each event.
Parameters
- name (String) - Name of the event to bind.
- callback (callback) - Callback to bind only once.
Return value
- Object - Current class instance.
overrideDefaults
overrideDefaults(defaultSettings:Object)Overrides the default settings for editor instances.
Parameters
- defaultSettings (Object) - Defaults settings object.
remove
remove(selector:tinymce.Editor):tinymce.EditorRemoves a editor or editors form page.
Examples
// Remove all editors bound to divs
tinymce.remove('div');
// Remove all editors bound to textareas
tinymce.remove('textarea');
// Remove all editors
tinymce.remove();
// Remove specific instance by id
tinymce.remove('#id');
Parameters
- selector (tinymce.Editor) - CSS selector or editor instance to remove.
Return value
- tinymce.Editor - The editor that got passed in will be return if it was found otherwise null.
resolve
resolve(n:String, o:Object):ObjectResolves a string and returns the object from a specific structure.
Examples
// Resolve a path into an object reference
var obj = tinymce.resolve('a.b.c.d');
Parameters
- n (String) - Path to resolve for example a.b.c.d.
- o (Object) - Optional object to search though, defaults to window.
Return value
- Object - Last object in path or null if it couldn't be resolved.
setActive
setActive(editor:tinymce.Editor)Sets the active editor instance and fires the deactivate/activate events.
Parameters
- editor (tinymce.Editor) - Editor instance to set as the active instance.
toArray
toArray(obj:Object):ArrayConverts the specified object into a real JavaScript array.
Parameters
- obj (Object) - Object to convert into array.
Return value
- Array - Array object based in input.
translate
translate(text:String):StringTranslates the specified string using the language pack items.
Parameters
- text (String) - String to translate
Return value
- String - Translated string.
triggerSave
triggerSave()Calls the save method on all editor instances in the collection. This can be useful when a form is to be submitted.
Examples
// Saves all contents
tinyMCE.triggerSave();
trim
trim(s:String):StringRemoves whitespace from the beginning and end of a string.
Parameters
- s (String) - String to remove whitespace from.
Return value
- String - New string with removed whitespace.
walk
walk(o:Object, f:function, n:String, s:String)Executed the specified function for each item in a object tree.
Parameters
- o (Object) - Object tree to walk though.
- f (function) - Function to call for each item.
- n (String) - Optional name of collection inside the objects to walk for example childNodes.
- s (String) - Optional scope to execute the function in.
Can't find what you're looking for? Let us know.
Except as otherwise noted, the content of this page is licensed under the Creative Commons BY-NC-SA 3.0 License, and code samples are licensed under the Apache 2.0 License.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论