如何在CKEditor中插入图片并始终添加链接至全尺寸图片

-1

我有CKEditor已启动并正在运行，但我希望在插入图片时自动在其之前添加<a href="...">标签。这是为了让人们可以点击img来查看它的实际大小。如何在CKEditor中插入图片并始终添加链接至全尺寸图片

目前，插入一张图片到编辑器时，它看起来就像这样：

<img alt="" src="/cms2/media/image/versuch(4).jpg" style="width: 1620px; height: 1080px;" />

我想这是一个<a href="..."></a>标签，像这样：

<a href="/cms2/media/image/versuch(4).jpg"><img alt="" src="/cms2/media/image/versuch(4).jpg" style="width: 1620px; height: 1080px;" /></a>

我怎么能做这个？

来源

2014-09-26 Chris

请与我们分享您试图做的事情。 – 2014-09-26 19:33:47

请不要将代码转储到注释中。用新信息更新您的原始帖子。 – 2014-09-26 19:38:23

这不是上传，这是插入。此外，如果您在询问后再阅读问题并帮助您了解问题是否有意义并且格式正确，它会有所帮助。 – Nenotlep 2014-09-30 08:24:42

您需要聆听正在关闭的图像对话框，并且在关闭图像对话框后，您需要自己插入标记。这是非常相似的https://stackoverflow.com/a/5071771/694325，我复制和编辑从那里的代码：

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 == 'image') { 
     dialogDefinition.onOk = function(e) { 
      var imageSrcUrl = e.sender.originalElement.$.src; 

      // HERE create your image element 
      // Note that you will need to insert the width and height too! 
      // Examine the available variables and DOM on how to do this. 
      // I won't do it for you :) 
      var htmlimg = '<img src="' + imageSrcUrl + '" style="width:100px;" />'; 
      var htmlstring = '<a href="' + imageSrcUrl + '">' + htmlimg + '</a>'; 

      CKEDITOR.instances.YOURINSTANCENAMEHERE.insertHtml(htmlstring); 
     }; 
    } 
}

来源

2014-09-30 08:35:37 Nenotlep

如何在CKEditor中插入图片并始终添加链接至全尺寸图片

回答

相关问题