summernote：如何验证用户当前选择是否在特定的 html 标记内？答案

【问题标题】：summernote: how to validate if the user current selection is inside a specific html tag?summernote：如何验证用户当前选择是否在特定的 html 标记内？
【发布时间】：2017-02-28 02:04:56
【问题描述】：

我想向我在summernote中制作的按钮添加一个行为，以向选择添加一个h4标签：

heading: function (context) {
            var ui = $.summernote.ui;
            var button = ui.button({
              contents: 'H',
              click: function () {
                var range = context.invoke('editor.createRange');
                  if (range.toString()) {
                    var heading = document.createElement('h4');
                    $(heading).text(range.toString());
                    context.invoke('editor.insertNode', heading);
                  } else {
                    context.invoke('editor.formatH4');
                  }
              }
            });

使用当前的 formatH4 不适用于我的用例，因为我想将此标记添加到用户范围选择中，而不是仅仅将整行格式化为 h4

现在我想向我的按钮添加行为，以便当光标位于 h4 标记内时它被选中

我尝试使用summernote api创建一个范围，但我不知道如何使用这个创建的范围来查看我是否在h4标签内

【问题讨论】：

标签： javascript jquery html summernote

【解决方案1】：

我找到了解决办法：

点击并按下按键我添加了这个：

window.getSelection().anchorNode.parentNode.nodeName

这给了我可以用来激活或停用按钮的节点名称

我在这里找到了这个解决方案：

How can I get the element in which highlighted text is in?

【讨论】：