Django CKEditor 给 a tag(标签)添加 target 默认值
启发文档
https://ckeditor.com/docs/ckeditor4/latest/guide/dev_disallowed_content.html
CKEDITOR.on( 'dialogDefinition', function( ev ) {
// Take the dialog name and its definition from the event data.
var dialogName = ev.data.name;
var dialogDefinition = ev.data.definition;
// Check if the definition is from the dialog window you are interested in (the "Link" dialog window).
if ( dialogName == 'link' ) {
// Get a reference to the "Link Info" tab.
var infoTab = dialogDefinition.getContents( 'info' );
console.log(infoTab);
// Set the default value for the URL field.
var urlField = infoTab.get( 'url' );
urlField[ 'default' ] = 'www.example.com';
}
});
我的思路
把上面实现的原理分析,默认的 url 是怎么加进去的。
在 django ckeditor 的 config.js 的代码中,我加了几个 console.log 得到结果:
就是两次 get 元素 id,得到需要的节点,再设置这个节点的默认值。
再看 超链接 的 目标 选项卡的值:
从这里也能看出 目标 窗口页面的默认值要获取的 id 是 linkTargetType,获取它要给它设置 default,就可以达到想要的目的。
实现代码
CKEditor config.js 代码路径:../lib/python3.6/site-packages/ckeditor/static/ckeditor/ckeditor/config.js
config.js 修改完后要重新收集静态文件部署,正式环境才能使用。而 debug 环境直接改 config.js 的源码就可以使用。
CKEDITOR.on('dialogDefinition', function (ev) {
// Take the dialog name and its definition from the event data
var dialogName = ev.data.name;
var dialogDefinition = ev.data.definition;
if (dialogName == "link") {
// Get a reference to the "Link Info" tab.
var infoTab = dialogDefinition.getContents('info');
console.log(infoTab);
// Set the default value for the URL field.
var urlField = infoTab.get('url');
urlField['default'] = 'https://xieboke.net/';
// Set the default value for the linkTargetType(目标窗口默认值)
var targetTab = dialogDefinition.getContents('target');
console.log(targetTab);
var targetField = targetTab.get("linkTargetType");
console.log(targetField);
targetField["default"] = "_blank";
}
})
额外发现
django ckeditor 的 config.js 里面的 dialogDefinition 有几个常用方法:
dialogDefinition.onOk(点击 确定 的时候)
dialogDefinition.onShow(展示弹框的时候)
dialogDefinition.onCancel(点击 取消 的时候)
其他实现方法
直接改掉 ../lib/python3.6/site-packages/ckeditor/static/ckeditor/ckeditor/plugins/link/dialogs/link.js 里 id 为 linkTargetType 的 default 的值:
type : 'select',
id : 'linkTargetType',
label : commonLang.target,
'default' : '_blank',
具体请看:https://stackoverflow.com/questions/46558041/ckeditor-default-target-link-blank-not-work-properly
相关文章
- 飞天加速计划·高校学生在家实践心得体会
- 飞天加速计划试用后感受
- 云服务初体验
- 第一次使用阿里云服务器的真实感受
- 阿里云ECS服务器体验
- 我的ECS心得
- 关于使用阿里云ECS服务器内心的感受
- HarmonyOS实战—统计按钮点击次数
- HarmonyOS实战—点击更换随机图片
- HarmonyOS实战—实现随机更换笑话段子
- PureFront个人博客
- 针对ECS服务器的使用感受
- 关于ECS的使用体验
- ESC云服务的学习感想
- 技术干货 | Native 页面下如何实现导航栏的定制化开发?
- ECS使用体验心得
- ECS两周使用体验
- 初识阿里云
- 服务器使用感言
- HarmonyOS实战—实现抖音点赞和取消点赞效果