在剑道编辑器中创建自定义按钮答案

【问题标题】：Creating custom button in kendo editor在剑道编辑器中创建自定义按钮
【发布时间】：2017-05-18 06:20:38
【问题描述】：

我正在使用kendo editor。当我想为多行创建项目列表时，遇到问题（见图）

为了解决这个问题，我创建了自定义按钮：

 {
                name: "custom",
                tooltip: "Insert a List",
                exec: function(e) {
                    var editor = $(this).data("kendoEditor");
                    var selectedText = editor.getSelection().toString();
                    if (selectedText.length > 0) {
                        var list = selectedText.split("\n").join("</li><li>");
                        list = "<ul><li>" + list.substring(0, list.length - 5) + "</ul>";
                    }
                    editor.exec("inserthtml", { value: list });
                }
            }

This code works fine when select whole text of line but when select just part of a line(not whole line just some character of line), list items not created from starting point of line.

【问题讨论】：

你能在dojo.telerik.com 中重现吗？
检查这个。 dojo.telerik.com/adILA
你的意思是像this..如果你完全选择文本no（第1项），则列表创建错误（第2项），而它应该像第3项一样创建。对吗？
(image 1) 和 (image 2) 是正确的，但在此示例中，我只想为项目 1 和 2 创建列表（当未选择“333”时，不会为它们创建列表）。结果将是：.111 .222 333
像图 2 一样，它应该为整个 222 创建，而不是损坏，对吧？

标签： javascript kendo-ui telerik kendo-asp.net-mvc kendo-editor

【解决方案1】：

在对 Selection 对象执行toString() 之前，您需要使用 Selection 和 Range API 以获得完整的文本节点，然后应用拆分。

https://developer.mozilla.org/en-US/docs/Web/API/Selection

https://developer.mozilla.org/en-US/docs/Web/API/Range

【讨论】：

我认为Range 和Selection 只能获取选定的文本，而不是所有文本。在这个问题中，我们需要在全文中找到选定的文本。