TinyMce 4.1.3 Code插件在MVC5中丢失Font Awesome列表标签的解决办法咨询

问题核心是TinyMCE默认的内容过滤规则会移除空的内联元素，以及未被明确允许的标签属性，导致你插入的<i class="fa-li fa fa-square" style="color: #f9a01b"></i>被过滤掉。可以通过修改TinyMCE的初始化配置解决：

步骤1：调整TinyMCE初始化配置 #

在你的MVC页面中，找到TinyMCE的初始化代码，添加以下配置项：

tinymce.init({
    selector: "#你的文本域ID",
    plugins: "code",
    // 允许<i>标签保留class和style属性
    extended_valid_elements: "i[class|style]",
    // 允许空标签（比如没有文本内容的<i>）
    allow_empty_elements: true,
    // 保留其他原有配置项
    // ...
});

步骤2：验证配置效果 #

重新加载页面后，使用Code插件插入目标代码：

<ul class="fa-ul">
    <li><i class="fa-li fa fa-square" style="color: #f9a01b"></i> text </li>
</ul>

保存后即可看到标签及属性被完整保留。

valid_elements: "@[class|style],p,ul,li,i",