在可编辑的div中切换选定文本的粗体

Question

我为我的学校网站编写了一个页面编辑器，一切顺利，但我遇到了从所选文本中删除字体样式的问题。我可以选择文本并获取jquery以将css类关联应用于span标记，当我想从所选文本中删除该类时，我的问题就来了。继承了我到目前为止所拥有的......

<div class="text" contenteditable="true">
Editable Content
</div>

我有一个事件监听器，它按下粗体按钮并触发下面的功能......

function makeBold() {
var range = window.getSelection().getRangeAt(0);
alert(range.anchorNode.parentNode.nodevalue);
var newNode = document.createElement('span');
newNode.className = "bold-text";
range.surroundContents(newNode);
}

此功能非常适用于应用样式，但我无法弄清楚如何使用切换将其删除。我很难理解如何使用范围选择来删除父标签。我试图使用.closest()选择器，但不断收到对象或未定义的错误？任何人都可以告诉我，我是否在正确的轨道上？

由于

戴夫

修改：

我没有使用像#myid或.classname这样的典型选择器我需要将样式应用于用户选择的文本，因此我可以使用带有上述函数的span标签将其包装起来。理想情况下，我需要找到一种方法来找到应用了.bold-text类的最近的父节点并将其删除。

Answer 1

使用jQuery的'removeClass'方法删除您要为要格式化的文本提供的类。在每个切换中，addClass和removeClass

http://api.jquery.com/removeclass/

做这样的事情

点击一下 - $('#id').addClass('class_of_text');

点击二下的

- $('.class_of_text').removeClass('.class_of_text);

点击三 - $('#id').addClass('class_of_text');

依旧......

Answer 2

您可以使用javascript的removeattribute从该元素中删除class属性。