将自定义元素添加到 Froala 编辑器的特定位置
Adding Custom Element to a Specific Position of Froala editor
单击我的自定义按钮后,我创建了一个特定的 table,其中包含一些特定元素(使用 jquery),并将其放置在 froala 编辑器中。但是,每当我将它放入编辑器中时,这个自定义 table 就会出现在 froala 编辑器的终点。例如,我有 3 个段落,我想在第 2 段和第 3 段之间添加这个 table,我单击我应该放置 table 的位置并插入它。但是,它出现在第三段的末尾。有没有办法可以获取当前光标位置并在此时放置 table?
提前致谢
编辑:语法
我可以解决这个问题。我在这个 link 中找到了答案:How can I get the element the caret is in with Javascript, when using contentEditable?
首先,我根据需要创建了自定义元素,然后,我将自定义元素放在所选位置的下一个兄弟元素之前,如下所示:
// gives the position :
var node = document.getSelection().anchorNode;
var selected_place = (node.nodeType == 3 ? node.parentNode : node);
//inserts to the selected place as I wanted
selected_place.parentNode.insertBefore(document.getElementById("my_custom_element"), selected_place.nextSibling);
单击我的自定义按钮后,我创建了一个特定的 table,其中包含一些特定元素(使用 jquery),并将其放置在 froala 编辑器中。但是,每当我将它放入编辑器中时,这个自定义 table 就会出现在 froala 编辑器的终点。例如,我有 3 个段落,我想在第 2 段和第 3 段之间添加这个 table,我单击我应该放置 table 的位置并插入它。但是,它出现在第三段的末尾。有没有办法可以获取当前光标位置并在此时放置 table?
提前致谢
编辑:语法
我可以解决这个问题。我在这个 link 中找到了答案:How can I get the element the caret is in with Javascript, when using contentEditable?
首先,我根据需要创建了自定义元素,然后,我将自定义元素放在所选位置的下一个兄弟元素之前,如下所示:
// gives the position :
var node = document.getSelection().anchorNode;
var selected_place = (node.nodeType == 3 ? node.parentNode : node);
//inserts to the selected place as I wanted
selected_place.parentNode.insertBefore(document.getElementById("my_custom_element"), selected_place.nextSibling);