粘贴到 KendoUI 编辑器时，如何从文本中删除所有 html 格式？

Posted 2023-05-07

【中文标题】粘贴到 KendoUI 编辑器时，如何从文本中删除所有 html 格式？

【英文标题】：How can I strip all html formatting from text when pasting into KendoUI Editor?

【发布时间】：2013-03-14 08:46:51

【问题描述】：

我想使用 KendoUI 编辑器基本上只允许用户将文本格式化为段落。可能允许粗体和下划线。

我正在为两件事苦苦挣扎：

我想在粘贴时从文本中去除所有 html 格式 我想禁用粗体、下划线等的键盘快捷键 - 即使工具栏元素不存在，它们似乎也能工作。

谢谢！

【参考方案1】：

为了粘贴唯一的文本，您可以定义一个粘贴处理程序来删除除文本之外的所有内容。这很简单：

$("#editor").kendoEditor(
    paste: function (ev) 
        ev.html = $(ev.html).text();
    
);

paste 处理程序接收一个事件作为参数，该事件在html 中包含正在解析的文本。我们可以使用 jQuery 来获取使用 $(ev.html).text() 的文本

为了删除快捷方式，并且就我可以使用最新的 Kendo UI 版本对其进行测试而言，如果您仅定义所需的工具，则只有这些快捷方式处于活动状态。所以如果你说这样的话：

$("#editor").kendoEditor(
    tools: [
        "italic"
    ],
    paste: function (ev) 
        ev.html = $(ev.html).text();
    
);

只有italic 快捷方式<ctrl>+i 可用。如果您将 tools 数组留空，则您没有任何数组。

【讨论】：

这可能适用于粘贴处理程序，谢谢。 （不过，考虑到时间限制和一些进一步的功能，比如标签白名单，我决定使用 TinyMCE 作为更快的解决方案）关于快捷方式，不幸的是，情况并非如此 - 我将工具数组留空并且仍然可以 + b等

它适用于我在 OSX 和 Firefox 和 Chrome 中使用 Kendo UI 2013.1.319...在这里查看jsfiddle.net/OnaBai/5yXej 我也尝试使用 Kendo UI 2012.3.1319，它也可以使用。你试过哪个环境？这个链接有效吗？

刚刚在 Windows7 和 Chrome 上试用过。我输入了一些文本，选择它并按 CTRL-B 并加粗。

:-( 在 Windows 7 和 IE8（版本 8.0.7601.17514）中尝试过并且可以工作但是当我在 chrome 中尝试失败时（！？）

【参考方案2】：

现在可以使用pasteCleanup 选项轻松实现。

请看这里：http://docs.telerik.com/kendo-ui/controls/editors/editor/pasting

【参考方案3】：

Kendo MVC 也为此目的提供了扩展。用法示例：

.PasteCleanup(x => x.KeepNewLines(false))

false 在这种情况下意味着您要清除除新行之外的所有内容。

【参考方案4】：

对我来说这是完整的解决方案

                pasteCleanup: 
                custom: function (html)
                
                    html = html.replace(/<\s*br\/*>/gi, '');
                    html = html.replace(/<\s*a.*href="(.*?)".*>(.*?)<\/a>/gi, " $2 (Link - $1) ");
                    html = html.replace(/<\s*\/*.+?>/ig, '');
                    html = html.replace(/ 2,/gi, '');
                    html = html.replace(/\n+\s*/gi, '');
                    html = html.replace("&nbsp;", '');
                    html = html.replace(/&lt;.*?&gt;/g, '');
                    return html;