如何使div在TinyMCE中表现得像img

Question

我写了一个插件，将弹出灯箱中的照片/视频插入到TinyMCE中。对齐/包裹时，这种方法很好并且格式很好。当它插入HTML时，如下所示：

<img src="blah.png" />

但从那以后我添加了一个允许字幕的功能，它使用了一个包装div，例如：

<div class="ImageWrapper" width="x" height="x">
  <img src="blah.png" />
  Caption here
</div>

现在有一些我无法解决的问题。

首先：如何让TinyMCE格式化/对齐div，就像使用img一样？

其次：如何阻止用户选择div的任何内容？相反，点击应突出显示整个div，以便格式化和删除工作更加顺畅。

Answer 1

问题是使用<div>作为包装器，显然TinyMCE自然不支持。你必须走得更远，而不是坐立不安。 TinyMCE是一个受欢迎的编辑器，人们已经尝试并提出了一个合适的解决方案。这是一个写了插件的人：http://www.tinymce.com/forum/viewtopic.php?id=20319
如果你谷歌搜索'tinymce div plugin'，可以找到更多信息：http://www.google.com/#q=tinymce+div+plugin

我不知道在你的情况下哪种方法最有效，所以我想你必须尝试一些解决方案（plpugins）。