用于ASP.NET的CKEditor插件,'ExtraPlugins'属性不起作用

时间:2013-01-08 11:21:14

标签: asp.net plugins ckeditor

我有两个ASP.NET Web窗体应用程序,第一个针对v4.0,第二个针对.NET框架的v4.5。我使用ASP.NET CKeditor插件v3.6.4。一切都很好,除了我不能使用'ExtraPlugins'属性注册我的'短语'插件。 Javascript解决方案有效:

CKEDITOR.replace('<%=CKEditor1.ClientID%>',
        {
            extraPlugins: 'phrases',
            toolbar:
            [
                ['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
                ['phrases']
            ]
        });

但'ExtraPlugins'属性解决方案不起作用:

<CKEditor:CKEditorControl ID="CKEditor1" BasePath="~/ckeditor" ExtraPlugins="phrases" Toolbar="Basic" runat="server" />

请求帮助。

祝你好运, WP

1 个答案:

答案 0 :(得分:3)

我做了一些实验,最后我知道它是如何工作的。

以下ASP.NET CKEditor Web控件标记位于* .aspx页面中:

<CKEditor:CKEditorControl ID="CKEditor1" BasePath="~/ckeditor" ExtraPlugins="phrases" Toolbar="Basic" runat="server" />

然后,此标记将在外发HTML文档中呈现,并以这种方式发送到用户浏览器:

第一部分:

<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
CKEditor_TextBoxEncode('CKEditor1', 0); 
return true;
}
//]]>
</script>

第二部分:

<textarea name="CKEditor1" rows="2" cols="20" id="CKEditor1">
</textarea>

第三部分:

<script type="text/javascript">
//<![CDATA[
var CKEditor_Controls=[],CKEditor_Init=[];function CKEditor_TextBoxEncode(d,e){var f;if(typeof CKEDITOR=='undefined'||typeof CKEDITOR.instances[d]=='undefined'){f=document.getElementById(d);if(f)f.value=f.value.replace(/</g,'&lt;').replace(/>/g,'&gt;');}else{var g=CKEDITOR.instances[d];if(e&&(typeof Page_BlockSubmit=='undefined'||!Page_BlockSubmit)){g.destroy();f=document.getElementById(d);if(f)f.style.visibility='hidden';}else g.updateElement();}};(function(){if(typeof CKEDITOR!='undefined'){var d=document.getElementById('CKEditor1');if(d)d.style.visibility='hidden';}var e=function(){var f=CKEditor_Controls,g=CKEditor_Init,h=window.pageLoad,i=function(){for(var j=f.length;j--;){var k=document.getElementById(f[j]);if(k&&k.value&&(k.value.indexOf('<')==-1||k.value.indexOf('>')==-1))k.value=k.value.replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&amp;/g,'&');}if(typeof CKEDITOR!='undefined')for(var j=0;j<g.length;j++)g[j].call(this);};window.pageLoad=function(j,k){if(k.get_isPartialLoad())setTimeout(i,0);if(h&&typeof h=='function')h.call(this,j,k);};if(typeof Page_ClientValidate=='function'&&typeof CKEDITOR!='undefined')Page_ClientValidate=CKEDITOR.tools.override(Page_ClientValidate,function(j){return function(){for(var k in CKEDITOR.instances){if(document.getElementById(k))CKEDITOR.instances[k].updateElement();}return j.apply(this,arguments);};});setTimeout(i,0);};if(typeof Sys!='undefined'&&typeof Sys.Application!='undefined')Sys.Application.add_load(e);if(window.addEventListener)window.addEventListener('load',e,false);else if(window.attachEvent)window.attachEvent('onload',e);})();CKEditor_Controls.push('CKEditor1');
CKEditor_Init.push(function(){if(typeof CKEDITOR.instances['CKEditor1']!='undefined' || !document.getElementById('CKEditor1')) return;CKEDITOR.replace('CKEditor1',{"extraPlugins" : "phrases", "htmlEncodeOutput" : true, "toolbar" : "Basic"}); });
//]]>
</script>

在源代码的第三部分中,有一个最重要的语句,它与ASP.NET CKEditor标记相同:

CKEDITOR.replace('CKEditor1',{"extraPlugins" : "phrases", "htmlEncodeOutput" : true, "toolbar" : "Basic"}); });

正如我们所看到的,ASP.NET WebControl的属性ExtraPlugings在CKEditor实例的Javascript配置中与extraPlugins属性相关联。

经过一些认可后,事实证明JS配置extraPlugins选项实际上没有附加插件在CKEditor工具栏中可见并且可以使用,但实际上只注册插件以允许使用它。插件可以这种方式注册,也可以在CKEditor的config.js配置文件中注册:

CKEDITOR.editorConfig = function( config )
{
    config.extraPlugins = 'phrases';

    // Define changes to default configuration here. For example:
    // config.language = 'fr';
    // config.uiColor = '#AADC6E';
};

注册后,必须以某种方式将插件添加到工具栏中以供使用,例如以这种方式:

<CKEditor:CKEditorControl ID="CKEditor1" BasePath="~/ckeditor" ExtraPlugins="phrases" Toolbar="[{ name: 'plugins', items: ['phrases'] }]" runat="server" />

或使用Javascript代码。

因此,总结:ExtraPlugins属性只会导致插件注册。如果我们想在CKEditor工具栏上使用它,我们必须编写适当的语句来配置CKEDitor工具栏。