具有唯一id的CKEDITOR样式
CKEDITOR style with unique id
我使用的是CKEDITOR样式系统——我想创建一个分配唯一属性的样式。
我有一个简单的插件,它调用我创建的样式:
editor.addCommand( 'tag', {
exec: function( editor ) {
var randnumber = Math.floor((Math.random()*1000000000)+1);
var mysqldatetime = new Date();
CKEDITOR.config.tag = { element : 'span', attributes : { 'class': 'tag-'+randnumber, 'data-datetime' : mysqldatetime, 'data-tag': 'tag' } };
var style = new CKEDITOR.style( editor.config.tag );
editor.addCommand( 'tag', new CKEDITOR.styleCommand( style ) );
}
});
但是datetime和randomnumber只生成一次。如何获得每次执行命令时要计算的属性?
尝试以下代码(jsFiddle):
CKEDITOR.replace( 'editor1', {
plugins: 'wysiwygarea,sourcearea,toolbar,basicstyles,link',
on: {
pluginsLoaded: function() {
var cmd = this.addCommand( 'tag', {
canUndo: true,
modes: { wysiwyg:1 },
// Otherwise the editor will purge your custom stuff.
allowedContent: 'span(*)[data-datetime,data-tag]{color}',
exec: function( editor ) {
var randnumber = Math.floor( ( Math.random() * 1000000000 ) + 1 ),
mysqldatetime = new Date();
// Alway apply a different style.
editor.applyStyle( new CKEDITOR.style( {
element: 'span',
attributes: {
'class': 'tag-' + randnumber,
'data-datetime': mysqldatetime,
'data-tag': 'tag'
},
styles: {
color: 'red'
}
} ) );
}
} );
// This is a custom command, so we need to register it.
this.addFeature( cmd );
}
}
} );
一些人必须阅读有关Advanced Content Filter+editor.applyStyle的信息。如果您的内容可能在受限内容类型的实例中使用,请考虑为其定义requiredContent
。
相关文章:
- 用CSS在CKEditor中设置预览样式
- CKeditor预览插件.js,为Chrome和IE进行编辑.因为它拒绝CSS样式
- 向ckeditor中的多个元素添加内联样式
- CKEditor自定义样式下拉列表,带有预览但没有内联
- 如何使用 JavaScript 将样式应用于 CKEditor 中的选定文本
- 具有自定义工具栏和自定义样式的CKEDITOR
- 债权人 - 将外部样式表应用于 CKEditor 文本区域中的内部文本
- 动态添加内容样式到 CKEditor 4 实例
- 如何将@media打印样式应用于 ckeditor 实例
- 铬中的 CKEDITOR 在光标位置添加“?”标记,同时应用任何样式(粗体/斜体)而不选择
- CKEDITOR将样式应用于选区
- 获取 CKEditor 中所选内容的样式值
- CKEditor 4:如何从插件添加CSS样式表
- CKEditor样式表未加载到目标页
- CKEDITOR没有't对来自数据库的文本进行样式设置
- 具有唯一id的CKEDITOR样式
- 如何禁用CKEditor自动样式和脚本加载
- CKEditor——如何添加特定于文档的CSS样式
- 文档中的CKEditor样式表
- 清除CKEditor样式标签