CKEditor ::按自定义标记包装内容

时间:2016-06-03 08:05:47

标签: javascript ckeditor

我为CKEditor编写了一个插件。我想在dialog之间用自定义样式包装编辑器的内容。

在这种情况下,我使用div作为样式div标记。如何在 onOk: function() { var dialog = this; var color = dialog.getValueOf('tab1', 'color'); // other styles var tag= '<div style="'; tag += 'color:' + color + ';'; // ... other styles tag += '">'; // tag += contents ; tag += "</div>"; editor.insertHtml(tag) }, contents: [{ ...

中包含编辑器的内容
/// <summary>
/// <see cref="IUrlHelper"/> extension methods.
/// </summary>
public static class UrlHelperExtensions
{
    /// <summary>
    /// Generates a fully qualified URL to an action method by using the specified action name, controller name and
    /// route values.
    /// </summary>
    /// <param name="url">The URL helper.</param>
    /// <param name="actionName">The name of the action method.</param>
    /// <param name="controllerName">The name of the controller.</param>
    /// <param name="routeValues">The route values.</param>
    /// <returns>The absolute URL.</returns>
    public static string AbsoluteAction(
        this IUrlHelper url,
        string actionName,
        string controllerName,
        object routeValues = null)
    {
        return url.Action(actionName, controllerName, routeValues, url.ActionContext.HttpContext.Request.Scheme);
    }

    /// <summary>
    /// Generates a fully qualified URL to the specified content by using the specified content path. Converts a
    /// virtual (relative) path to an application absolute path.
    /// </summary>
    /// <param name="url">The URL helper.</param>
    /// <param name="contentPath">The content path.</param>
    /// <returns>The absolute URL.</returns>
    public static string AbsoluteContent(
        this IUrlHelper url,
        string contentPath)
    {
        HttpRequest request = url.ActionContext.HttpContext.Request;
        return new Uri(new Uri(request.Scheme + "://" + request.Host.Value), url.Content(contentPath)).ToString();
    }

    /// <summary>
    /// Generates a fully qualified URL to the specified route by using the route name and route values.
    /// </summary>
    /// <param name="url">The URL helper.</param>
    /// <param name="routeName">Name of the route.</param>
    /// <param name="routeValues">The route values.</param>
    /// <returns>The absolute URL.</returns>
    public static string AbsoluteRouteUrl(
        this IUrlHelper url,
        string routeName,
        object routeValues = null)
    {
        return url.RouteUrl(routeName, routeValues, url.ActionContext.HttpContext.Request.Scheme);
    }
}

1 个答案:

答案 0 :(得分:0)

好的,我找到了解决方案:

首先在config.js中添加以下行:

config.allowedContent = 'div{*}'; // this is important

请参阅herehere

然后在onOk函数执行此操作:

   onOk: function() {
            contents = editor.document.getBody().getHtml(); // get the content of CKEditor
            var dialog = this;
            var color = dialog.getValueOf('tab1', 'color');
            // other styles
            var tag= '<div style="';
            tag += 'color:' + color + ';';
            // ... other styles
            tag += '">';
            tag += contents ;
            tag += "</div>";
            editor.setData(tag);
        },
        contents: [{ ...