如何在CKEditor中自动为img标签添加类或属性?

2023-11-24

我使用的是 CKEditor 版本 3.6

我想自动添加class="newsleft"到通过所见即所得添加的任何图像标签。

我看过一些提到 dataProcessor 的帖子,但不知道应该添加哪个文件或如何添加。

有人可以告诉我在哪里放置以下代码吗?

editor.dataProcessor.htmlFilter.addRules(
{
    elements:
    {
        img: function( element )
        {
            if ( !element.attributes.alt )
                element.attributes.alt = 'An image';
        }
    }
} );

基本上放进去instanceReady监听器,那就没问题了(3.x 和 4.x)(fiddle):

CKEDITOR.replace( 'editor', {
    plugins: 'wysiwygarea,toolbar,sourcearea,image,basicstyles',
    on: {
        instanceReady: function() {
            this.dataProcessor.htmlFilter.addRules( {
                elements: {
                    img: function( el ) {
                        // Add an attribute.
                        if ( !el.attributes.alt )
                            el.attributes.alt = 'An image';

                        // Add some class.
                        el.addClass( 'newsleft' );
                    }
                }
            } );            
        }
    }
} );

CKEDITOR.htmlParser.element.addClass自 CKEditor 4.4 起可用。您可以使用this.attributes[ 'class' ]在该版本之前。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在CKEditor中自动为img标签添加类或属性? 的相关文章

随机推荐

  • R 数据帧子集的行的随机样本[重复]

    这个问题在这里已经有答案了 有没有一种从数据帧的一部分获取行样本的好方法 如果我只有这样的数据 gender lt c F M M F F M F F age lt c 23 25 27 29 31 33 35 37 然后我可以轻松地采样三
  • CSS3圆角与谷歌地图

    我正在尝试在 Google 地图中使用 css3 border radius 属性来应用圆角边框 但它在 Chrome 中不起作用 在其他浏览器中效果很好 有什么想法或建议吗 我在这里输入我的代码并等待积极答复 谢谢
  • Cassandra 中的异步写入似乎被破坏

    在将 900 万行批量写入 12 节点 cassandra 2 1 2 集群时 我遇到了 Spark cassandra connector 1 0 4 1 1 0 的问题 我以一致性 ALL 写入并以一致性 1 读取 但每次读取的行数都不
  • Matlab 不使用 imrotate 进行图像旋转

    我正在尝试使用 Matlab 旋转图像而不使用 imrotate 函数 我其实是用变换矩阵做到的 但是还不够好 问题是 旋转后的图像是 滑动的 让我用图片告诉你 这是我想要旋转的图像 但是当我旋转它时 例如45度 它就变成了这样 我问为什么
  • 在Java中生成正弦波时背景噪音

    当我运行以下代码时 我在后台出现轻微的失真 听起来像嗡嗡声 由于其微妙的性质 它让人相信字节转换中存在某种别名 AudioFormat PCM SIGNED 44100 0 Hz 16 位 立体声 4 字节 帧 大端 Note 代码假设 目
  • MongooseError:“openUri()”的“uri”参数必须是字符串

    我的代码有问题我在其中使用了这段代码 应用程序 js const mongoose require mongoose const dotenv require dotenv dotenv config mongoose connect pr
  • 如何检查 Windows 窗体是否已打开,如果打开则将其关闭?

    我有一个表格 fm 这是一个简单的信息窗口 每 10 分钟打开一次 fm Show 我怎样才能做到每 10 分钟检查一次表格是否 fm 已打开 如果已打开 则会将其关闭并再次打开 现在 fm 形式始终是用以下命令创建的form fm new
  • 编写包含多个变量的 CSV

    我目前有两个清单 lat 34 78 34 82 34 86 34 92 lon 86 02 86 06 86 10 86 14 我正在尝试编写一个 csv 文件 将它们输出为纬度 经度 34 78 86 02 34 82 86 06 34
  • 事务在触发器中结束 批次已中止

    我在用Sql Server 2008 我有一个Trigger这更新了我的另外两个表 我已阅读堆栈溢出此链接在此输入链接描述 但它并不能完全满足我的需求 下面是我的Trigger ALTER TRIGGER Inventory StockUp
  • 使用 SHFILEINFO 获取文件图标

    我一直在寻找一个 C 库 它可以获取给定路径的多种尺寸的图标 最后当我确切地得到我需要的类时 它有一个问题 此方法获取给定路径的图标 public static BitmapSource GetIcon string FileName bo
  • RESTful 多对多可能吗?

    如何为 REST 帖子表示复杂资源 你好 目前我有一个应用程序 当用户点击 保存 时 它会迭代所有表单元素并创建一个管理以下内容的质量对象 var params attributes1 form1 getValues attributes2
  • PHP get_headers() 报告的标头与 CURL 不同

    怎么可能get headers 可能会返回与通过 CURL 获取不同的结果吗 这是我的代码 header Content type text plain url http www foxbusiness com index html ech
  • 仅在 Firefox 中出现 JQuery AJAX 异常:“无法在层次结构中的指定点插入节点”(HierarchyRequestError)

    非常奇怪的问题 我有一个由两部分组成的下拉列表 其中选择一个州将添加第二个下拉列表 为您提供该州的 MSA 区域列表 这是通过使用向控制器发出 JQuery Get 请求来完成的 该控制器返回选择下拉列表中的区域列表 例如 jQuery f
  • Android 5.0 (Lollipop) 上的拆分操作栏

    有谁知道Android 5 0中是否删除了狭窄功能时的分割操作栏 看起来它对布局不再有任何影响 由于这个问题之前没有得到真正的回答 有谁知道Android 5 0中是否删除了狭窄功能时的分割操作栏 Yes it was 尽管该更改没有记录在
  • 我需要采取哪些步骤才能从类库转换为 WCF?

    我创建了一个项目作为类库 现在我需要将其制作成 WCF 我可以创建一个 WCF 项目 但我想避免所有与 TFS 相关的麻烦 我已经完成了 App config 并将 client wcfTestClient exe 行添加到命令行参数中 但
  • 使用 DOM 将 SVG 元素添加到现有 SVG

    我有一个类似于以下代码的 HTML 结构 div div
  • Magento 目录 URL 重写在处理过程中卡住

    正如标题所示 我的目录 URL 重写索引器卡在处理中 我已经尝试了一切 但找不到解决方案 有谁知道这个问题的可靠解决方法吗 我尝试截断 core url rewrite 表并删除锁 但它仍然处于处理状态 当通过管理运行它时 页面只是继续加载
  • PHP 修改文本文件中的单行

    我尝试并寻找解决方案 但找不到任何明确的解决方案 基本上 我有一个列出用户名和密码的 txt 文件 我希望能够更改某个用户的密码 users txt 文件的内容 user1 pass1 user2 pass2 user3 pass3 我尝试
  • Python 中的嵌套 for 循环

    我想做类似的事情 for a in 0 1 for b in 0 1 for c in 0 1 do something 但是 我可能有 15 个不同的变量 有没有更简单的方法 比如 for a b c in 0 1 do somethin
  • 如何在CKEditor中自动为img标签添加类或属性?

    我使用的是 CKEditor 版本 3 6 我想自动添加class newsleft 到通过所见即所得添加的任何图像标签 我看过一些提到 dataProcessor 的帖子 但不知道应该添加哪个文件或如何添加 有人可以告诉我在哪里放置以下代