Javascript 在dialogDefinition上添加的另一个元素的设置函数中,CKEditor get table dialog class init Value

Javascript 在dialogDefinition上添加的另一个元素的设置函数中,CKEditor get table dialog class init Value,javascript,jquery,dialog,ckeditor,Javascript,Jquery,Dialog,Ckeditor,在阅读代码之前,请先阅读问题 我在它工作的表对话框的对话框定义中添加了一个复选框元素。现在,我希望在默认情况下,当正在编辑的表具有某个类(通常在“高级”选项卡上可见)时,选中该复选框。根据文档,我应该能够在设置功能中执行类似的操作。我尝试过很多事情,希望你能帮助我。这是我的密码 CKEDITOR.on( 'dialogDefinition', function( evt ) { var dialog = evt.data; if(dialog.name == 'table' ||

在阅读代码之前,请先阅读问题

我在它工作的表对话框的对话框定义中添加了一个复选框元素。现在,我希望在默认情况下,当正在编辑的表具有某个类(通常在“高级”选项卡上可见)时,选中该复选框。根据文档,我应该能够在设置功能中执行类似的操作。我尝试过很多事情,希望你能帮助我。这是我的密码

CKEDITOR.on( 'dialogDefinition', function( evt )
{
    var dialog = evt.data;
    if(dialog.name == 'table' || dialog.name=='tableProperties')
    {
        // Get dialog definition.
        var def = evt.data.definition;
        var infoTab = def.getContents( 'info' );

        infoTab.add(
        {
            type: 'checkbox',
            id: 'myCheckBox',
            label: 'Table Has Property',
            setup: function()
            {
                //Class to look for if I successfully get the input's value
                var classValueToLookFor = 'has-property';

                // The current CKEditor Dialog Instance
                var thisDialog = CKEDITOR.dialog.getCurrent();

                // The Element whose value I want to get
                var classElement = theDialog.getContentElement('advanced','advCSSClasses');

                // Trying to Get Value of this class Element According to documentation
                var containedClasses = theDialog.getValueOf('advanced','advCSSClasses');

                // Trying to debug the value above
                 console.log(containedClasses);  // This shows nothing

                // Trying to debug InitValue which shows something according to prototype 
                 console.log(classElement.getInitValue()); //This also shows nothing

                //Checking if Element has the class I'm looking for to mark the checkbox
                if(containedClasses.indexOf(classValueToLookFor) != -1)
                {
                    //Check current checkbox since value has been found                    
                    this.setValue('checked');
                }
            }
            onClick: function()   // You can ignore this function, just put it in case you were wondering how I'm putting the has-property, might help someone else (works well) ;)
            {
                 var checked =  this.getValue();
                 var classValueToSet = 'has-property';
                 var thisDialog = CKEDITOR.dialog.getCurrent();
                 var containedClasses = theDialog.getValueOf('advanced','advCSSClasses');
                 if(checked)
                 {
                      if(containedClasses.indexOf(classValueToSet) != -1)
                      {
                        //console.log('already contains class: '+classValueToSet);
                      }
                      else
                      {
                        containedClasses += containedClasses+" "+classValueToSet;
                      }
                 }
                 else
                 {
                      if(containedClasses.indexOf(classValueToSet) != -1)
                      {
                           containedClasses = containedClasses.replace(classValueToSet,'');
                      }
                      else
                      {
                        //console.log('already removed class: '+classValueToSet);
                      }
                 }
                 thisDialog.setValueOf('advanced','advCSSClasses',containedClasses);
            }
        }
}
下面是一些调试语句,它们有助于添加到setup函数中,并理解正在发生的事情,您不需要经历我所经历的一切

console.log('in setup function');
console.log(classElement);
console.log(classElement._);
console.log(classElement.getInitValue());
console.log(classElement.getInputElement());
var inputElement = classElement.getInputElement();
var inputElementId = inputElement.getId();
console.log($('#'+inputElementId+'.cke_dialog_ui_input_text'));    
console.log(classElement.getInputElement().value);

建议之前最好先测试一下你的答案。我尝试过的许多方法在理论上应该是可行的,但实际上是行不通的。

好吧,经过几天的反复试验,这就是我最终成功的方法。也许这对某人有帮助。我相信应该有一个更干净的方法来做到这一点。祝大家万事如意

setup: function()
{
   //This current checkbox
   var checkbox = this;

   //the class I want to find on my table
   var var classValueToLookFor = 'has-property';

   //Current Dialog instance
   var thisDialog = CKEDITOR.dialog.getCurrent();

  //This code below gets a <td> element in the table
   var startElement = thisDialog.getParentEditor().getSelection().getStartElement();

  // This gets me the parent of the <td> element which is my current table instance
   var parentTable = $(startElement.$.offsetParent);

  //Finally check if the table has the property I'm looking for.
   if(parentTable.hasClass(classValueToLookFor))
   {
       //Mark the checkbox
       checkbox.setValue('checked');
   }

}