可视区块

此插件允许用户在可编辑区域中查看块级元素。它类似于WYSIWYG隐藏字符功能，但应用于块级别。它还会在 View 菜单下拉列表中添加一个工具栏按钮和一个名为 Show blocks 的菜单项。

基本设置

tinymce.init({
  selector: 'textarea',  // 根据需要修改此值以匹配您的HTML
  plugins: 'visualblocks',
  toolbar: 'visualblocks'
});

关于如何使用模块打包工具打包此插件的信息，请参阅 打包 TinyMCE - 概述。

选项

此设置影响 visualblocks 插件的执行。您可以在此指定块是否默认可见。

visualblocks_default_state

通过此选项，您可以指定 Visual Blocks 插件的默认状态。

类型： Boolean

默认值： false

可能的值： true, false

示例：使用 visualblocks_default_state

tinymce.init({
  selector: 'textarea',  // 根据需要修改此值以匹配您的HTML
  plugins: 'visualblocks',
  toolbar: 'visualblocks',
  visualblocks_default_state: true
});

工具栏按钮

Visual Blocks 插件提供以下工具栏按钮：

可以通过以下方式将这些工具栏按钮添加到编辑器中：

• toolbar 配置选项。

• quickbars_insert_toolbar 配置选项。

• 自定义上下文工具栏。

菜单项

Visual Blocks 插件提供以下菜单项：

可以通过以下方式将这些菜单项添加到编辑器中：

• menu 配置选项。

• contextmenu 配置选项。

• 自定义菜单工具栏按钮。

命令

Visual Blocks 插件提供以下 TinyMCE 命令。

tinymce.activeEditor.execCommand('mceVisualBlocks');