Question

我有一些带有特殊类的<div>元素，我希望它们不能通过上下文菜单进行编辑。有办法吗？我尝试过：

CKEDITOR.dtd.$nonEditable = "div(myclass)";

和

allowedContent: {
                    $1: {
                        elements: CKEDITOR.dtd,
                        attributes: true,
                        styles: true,
                        classes: true
                    }
                },
                disallowedContent: "div(myclass)",

我还尝试从<div>中排除menu_groups: '';，但不能将<div>的某些类（全部）排除在外。

PS：我需要保留 contextmenu 插件，仅删除某些元素即可。

Answer 1

我使用 if 和 Conditional（三元）运算符方法来隐藏和禁用上下文菜单项访问

方法一：右键单击时不显示contextMenu项

方法二：该条件禁用contextMenu项功能 TRISTATE_OFF ||TRISTATE_DISABLED || Conditional_Operator

var editor = CKEDITOR.appendTo('editorSpace', { toolbar: [] });
editor.on( 'instanceReady', function(e) { 
   editor.resize(200, 200); 
   editor.addCommand("myCommandEdit", {
        exec : function( editor ){          
         alert("Edit DIV"); // write your own function
      }});
   editor.addCommand("myCommandRemove", {
        exec : function( editor ){alert("Div Removed");}
    }); 
    // Listener 
  editor.contextMenu.addListener(function(element, selection ) {
  var ascendant = element.getAscendant( 'div' );
  var divCondtion = ascendant.getAttribute('class') != 'myclass';
  // Method 1
    if(divCondtion){
    return { 
        div_Edit : CKEDITOR.TRISTATE_OFF,
        div_Remove : CKEDITOR.TRISTATE_OFF 
     };
    }
  // Method 2

return { 
    div_Edit: divCondtion ? CKEDITOR.TRISTATE_OFF : CKEDITOR.TRISTATE_DISABLED,
   div_Remove: divCondtion ? CKEDITOR.TRISTATE_OFF : CKEDITOR.TRISTATE_DISABLED
    };      
});

editor.addMenuItems({
 div_Edit : {
      label : 'Edit DIV',
      command : 'myCommandEdit',
      group : 'DivEditGroup',
      order : 1
   },
   div_Remove : {
      label : 'Remove DIV',
      command : 'myCommandRemove',
      group : 'DivEditGroup',
      order : 2
   }
});

});

如何禁用某些元素的CKEditor上下文菜单？

1 个答案: