Question

我有以下代码：

<div class='o-main__subsection'> <h5 class = 'u-text-blue
has-popup-toggle'>smth <a class='c-popup-toggle'
id='smth' data-name='smth' data-title='smth'
data-imgurl='assets/i/content/smth.jpg' href='javascript:void(0)'><i
class='fa fa-camera'></i></a></h5>
<p>text</p>    </div><!-- o-main__subsection -->

当我将此代码作为源代码放在tinymce编辑器中时，它会删除<a></a>个标记之间的所有内容。它是关于rails 4应用程序上的红宝石。我怎么能解决这个问题？

Answer 1

您需要修改TinyMCE配置以允许标记，并允许标记上的属性有效。

默认情况下，TinyMCE会将转换为，将转换为。您可以在TinyMCE配置中更改此设置，如下所示：

tinymce.init({
  selector: "textarea",
  plugins: [ ... ],
  toolbar: " ... ",
  formats: {
    bold: { inline: 'b' },
    italic: { inline: 'i' }
  },
  extended_valid_elements: 'b[*],i[*]'
});

您需要formats和extended_valid_elements更改才能使其生效。

另一个问题是你的href中有JavaScript，所以TinyMCE的XSS过滤器正在参与其中。如果将代码更改为以下内容，则不会触发XSS过滤器：

<div class="o-main__subsection">
  <h5 class="u-text-blue has-popup-toggle">smth 
    <a id="smth" class="c-popup-toggle" href="#" 
       data-name="smth" data-title="smth" 
       data-imgurl="assets/i/content/smth.jpg">
      <i class="fa fa-camera"></i>
    </a>
  </h5>
  <p>text</p>
</div>

这是一个TinyMCE小提琴，显示了这一点：http://fiddle.tinymce.com/a1faab

TinyMCE删除<a></a>标签之间的内容，原因

1 个答案: