javascript - tinyMCE 在 getContent 上将 <i> 变成 <em>

标签 javascript ruby-on-rails tinymce

在我的 tinyMCE 编辑器的 dom 中,我看到了

<p>
  <i>testing 123</i>
</p>

但是当我运行的时候

tinyMCE.activeEditor.getContent()

返回

<p>
  <em>testing 123</em>
</p>

为什么会变 <i>进入<em> ?我对此有疑问,因为我想动态插入被标签包围的文本,而且事情变得困惑。

最佳答案

default rule set对于 valid_elements选项包含 em/i这意味着所有 <i>标签将替换为 <em>在输出中。您可以添加自己的 valid_elements选项将离开 <i>完好无损的。您可以修改默认规则集:

valid_elements : "@[id|class|style|title|dir<ltr?rtl|lang|xml::lang|onclick|ondblclick|"
+ "onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|"
+ "onkeydown|onkeyup],a[rel|rev|charset|hreflang|tabindex|accesskey|type|"
+ "name|href|target|title|class|onfocus|onblur],strong/b,em,i,strike,u,"
+ "#p,-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|"
+ "src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup,"
+ "-blockquote,-table[border=0|cellspacing|cellpadding|width|frame|rules|"
+ "height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|"
+ "height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,"
+ "#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor"
+ "|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,"
+ "-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face"
+ "|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],"
+ "object[classid|width|height|codebase|*],param[name|value|_value],embed[type|width"
+ "|height|src|*],script[src|type],map[name],area[shape|coords|href|alt|target],bdo,"
+ "button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|"
+ "valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method],"
+ "input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value],"
+ "kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value],"
+ "q[cite],samp,select[disabled|multiple|name|size],small,"
+ "textarea[cols|rows|disabled|name|readonly],tt,var,big"

注意我替换了em/iem,i .这样既<i><em>是有效标签,在输出中都不会被替换。

如果这太多了,您还可以减少有效元素的列表,使其仅包含您在 HTML 中真正需要的那些元素。例如,您可能不允许您的用户创建任何表,因此您可以删除所有对 table 的引用。 , tbody , tr , td等等

关于javascript - tinyMCE 在 getContent 上将 <i> 变成 <em>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3105656/

相关文章:

javascript - 按钮单击事件触发错误的事件处理程序

javascript - 在 React 中获取子组件的高度

javascript - 如何在悬停时获取图像的整个 HTML?

javascript - 在浏览器中格式化 Rails/ERB HTML 输出

ruby-on-rails - Rails如何判断数据库中某条记录是否有某列数据?

javascript - 无法从 Javascript 中的 csv 读取数据

ruby-on-rails - 将 base64 图像转换为用于 Carrierwave 的 StringIO

javascript - 如何安全地接受包含来自所见即所得编辑器的 iframe 的用户输入?

javascript - 如何在 tinyMCE 中添加字体大小的工具栏?

jQuery 获取元素 html() 的更新值