识别网页中所选文本是否为粗体

2022-01-15 00:00:00 format selection range javascript bold

我正在尝试确定所选文本(在 Firefox 中)是否为粗体?例如:

I am trying to identify whether a selected text (in Firefox) is bold or not? For e.g.:

<p>Some <b>text is typed</b> here</p>

<p>Some <span style="font-weight: bold">more text is typed</span> here</p>

用户可以选择部分粗体文本，也可以选择完整的粗体文本.这是我想要做的:

The user can either select a part of bold text, or the full bold text. Here is what I am trying to do:

function isSelectedBold(){
    var r = window.getSelection().getRangeAt(0);
    // then what?
}

你能帮帮我吗?

谢谢
斯里坎特

推荐答案

如果选择在可编辑元素或文档中，这很简单:

If the selection is within an editable element or document, this is simple:

function selectionIsBold() {
    var isBold = false;
    if (document.queryCommandState) {
        isBold = document.queryCommandState("bold");
    }
    return isBold;
}

否则，这有点棘手:在非 IE 浏览器中，您必须暂时使文档可

Otherwise, it's a little trickier: in non-IE browsers, you'll have to temporarily make the document editable:

function selectionIsBold() {
    var range, isBold = false;
    if (window.getSelection) {
        var sel = window.getSelection();
        if (sel && sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            document.designMode = "on";
            sel.removeAllRanges();
            sel.addRange(range);
        }
    }
    if (document.queryCommandState) {
        isBold = document.queryCommandState("bold");
    }
    if (document.designMode == "on") {
        document.designMode = "off";
    }
    return isBold;
}

相关文章