- 快速入门
- 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-Formatter
Examples
tinymce.activeEditor.formatter.register('mycustomformat', {
inline: 'span',
styles: {color: '#ff0000'}
});
tinymce.activeEditor.formatter.apply('mycustomformat');
Methods
name | summary | defined by |
---|---|---|
apply() | Applies the specified format to the current selection or specified node. | tinymce.Formatter |
canApply() | Returns true/false if the specified format can be applied to the current selection or not. It will currently only check the state for selector formats, it returns true on all other format types. | tinymce.Formatter |
formatChanged() | Executes the specified callback when the current selection matches the formats or not. | tinymce.Formatter |
get() | Returns the format by name or all formats if no name is specified. | tinymce.Formatter |
getCssText() | Returns a preview css text for the specified format. | tinymce.Formatter |
has() | Returns true or false if a format is registered for the specified name. | tinymce.Formatter |
match() | Matches the current selection or specified node against the specified format name. | tinymce.Formatter |
matchAll() | Matches the current selection against the array of formats and returns a new array with matching formats. | tinymce.Formatter |
matchNode() | Return true/false if the specified node has the specified format. | tinymce.Formatter |
register() | Registers a specific format by name. | tinymce.Formatter |
remove() | Removes the specified format from the current selection or specified node. | tinymce.Formatter |
toggle() | Toggles the specified format on/off. | tinymce.Formatter |
unregister() | Unregister a specific format by name. | tinymce.Formatter |
Methods
apply
apply(name:String, vars:Object, node:Node)Applies the specified format to the current selection or specified node.
Parameters
- name (String) - Name of format to apply.
- vars (Object) - Optional list of variables to replace within format before applying it.
- node (Node) - Optional node to apply the format to defaults to current selection.
canApply
canApply(name:String):booleanReturns true/false if the specified format can be applied to the current selection or not. It will currently only check the state for selector formats, it returns true on all other format types.
Parameters
- name (String) - Name of format to check.
Return value
- boolean - true/false if the specified format can be applied to the current selection/node.
formatChanged
formatChanged(formats:String, callback:function, similar:Boolean)Executes the specified callback when the current selection matches the formats or not.
Parameters
- formats (String) - Comma separated list of formats to check for.
- callback (function) - Callback with state and args when the format is changed/toggled on/off.
- similar (Boolean) - True/false state if the match should handle similar or exact formats.
get
get(name:String):Array, ObjectReturns the format by name or all formats if no name is specified.
Parameters
- name (String) - Optional name to retrieve by.
Return value
- Array - Array/Object with all registered formats or a specific format.
- Object - Array/Object with all registered formats or a specific format.
getCssText
getCssText(format:String):StringReturns a preview css text for the specified format.
Examples
var cssText1 = editor.formatter.getCssText('bold');
var cssText2 = editor.formatter.getCssText({inline: 'b'});
Parameters
- format (String) - Format to generate preview css text for.
Return value
- String - Css text for the specified format.
has
has(name:String):booleanReturns true or false if a format is registered for the specified name.
Parameters
- name (String) - Format name to check if a format exists.
Return value
- boolean - True/False if a format for the specified name exists.
match
match(name:String, vars:Object, node:Node):booleanMatches the current selection or specified node against the specified format name.
Parameters
- name (String) - Name of format to match.
- vars (Object) - Optional list of variables to replace before checking it.
- node (Node) - Optional node to check.
Return value
- boolean - true/false if the specified selection/node matches the format.
matchAll
matchAll(names:Array, vars:Object):ArrayMatches the current selection against the array of formats and returns a new array with matching formats.
Parameters
- names (Array) - Name of format to match.
- vars (Object) - Optional list of variables to replace before checking it.
Return value
- Array - Array with matched formats.
matchNode
matchNode(node:Node, name:String, vars:Object, similar:Boolean):ObjectReturn true/false if the specified node has the specified format.
Parameters
- node (Node) - Node to check the format on.
- name (String) - Format name to check.
- vars (Object) - Optional list of variables to replace before checking it.
- similar (Boolean) - Match format that has similar properties.
Return value
- Object - Returns the format object it matches or undefined if it doesn't match.
register
register(name:Object, format:Object)Registers a specific format by name.
Parameters
- name (Object) - Name of the format for example "bold".
- format (Object) - Optional format object or array of format variants can only be omitted if the first arg is an object.
remove
remove(name:String, vars:Object, node:Node)Removes the specified format from the current selection or specified node.
Parameters
- name (String) - Name of format to remove.
- vars (Object) - Optional list of variables to replace within format before removing it.
- node (Node) - Optional node or DOM range to remove the format from defaults to current selection.
toggle
toggle(name:String, vars:Object, node:Node)Toggles the specified format on/off.
Parameters
- name (String) - Name of format to apply/remove.
- vars (Object) - Optional list of variables to replace within format before applying/removing it.
- node (Node) - Optional node to apply the format to or remove from. Defaults to current selection.
unregister
unregister(name:String)Unregister a specific format by name.
Parameters
- name (String) - Name of the format for example "bold".
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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论