文本高亮问题

发布于 2024-10-19 02:40:40 字数 1511 浏览 1 评论 0原文

我正在修复编辑器,但有突出显示文本的问题。

我得到了这个代码来检查用户突出显示的内容(代码下方有更多详细信息):

function getSelectionHTML()
{
    var iframe = document.getElementById(theEditorID);
    var win, doc = iframe.contentDocument;
    if(doc)
        win = doc.defaultView;
    else
    {
        win = iframe.contentWindow;
        doc = win.document;
    }
    var userSelection;

    if(win.getSelection)
    {
        userSelection = win.getSelection();
        if(userSelection.getRangeAt)
            var range = userSelection.getRangeAt(0);
        else
        {
            var range = document.createRange();
            range.setStart(userSelection.anchorNode, userSelection.anchorOffset);
            range.setEnd(userSelection.focusNode, userSelection.focusOffset);
        }
        var clonedSelection = range.cloneContents();
        var div = document.createElement('div');
        div.appendChild(clonedSelection);
        callIcons(div.innerHTML);
    }
    else if(doc.selection)
    {
        userSelection = document.selection.createRange();
        callIcons(userSelection.htmlText);
    }
};

当用户突出显示一些粗体文本和其他一些斜体文本时,我得到了这个输出:

<b>some text</b><i>some other text</i>

但是当用户仅突出显示粗体文本时,我得到了这个输出(有没有“粗体”标签):

some text

您可以在此处实时查看 - http://brownfolder.com/06/< /a> 突出显示某些文本后,您会看到一条警报。

您知道如何解决这个问题吗?

提前致谢。

I am fixing an editor and I have highlighting text problem.

I got this code for checking what have the user highlighted (more details below the code):

function getSelectionHTML()
{
    var iframe = document.getElementById(theEditorID);
    var win, doc = iframe.contentDocument;
    if(doc)
        win = doc.defaultView;
    else
    {
        win = iframe.contentWindow;
        doc = win.document;
    }
    var userSelection;

    if(win.getSelection)
    {
        userSelection = win.getSelection();
        if(userSelection.getRangeAt)
            var range = userSelection.getRangeAt(0);
        else
        {
            var range = document.createRange();
            range.setStart(userSelection.anchorNode, userSelection.anchorOffset);
            range.setEnd(userSelection.focusNode, userSelection.focusOffset);
        }
        var clonedSelection = range.cloneContents();
        var div = document.createElement('div');
        div.appendChild(clonedSelection);
        callIcons(div.innerHTML);
    }
    else if(doc.selection)
    {
        userSelection = document.selection.createRange();
        callIcons(userSelection.htmlText);
    }
};

When the user highlight some bold text and some other italic text i got this output:

<b>some text</b><i>some other text</i>

But when the user highlight only bold text i got this output (there is no 'bold' tag):

some text

You can check that, live, here - http://brownfolder.com/06/
You'll see an alert after highlighting some text.

Do you have any idea how can I fix this?

Thanks in advance.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

晨敛清荷 2024-10-26 02:40:40

浏览器根据是否在选择中包含周围标签而有所不同。如果选择完全包含在标签内,则它们通常不包括周围的标签。可以从选择的开始处遍历 DOM 并检查每个元素是否是 。标签。但是,如果您正在使用的 iframe 使用 contenteditable,则不能保证它会以 粗体显示。标签。还有其他方式可以将文本加粗:IE 通常会添加 。标签加粗,Firefox 和 WebKit 可能使用

使用 queryCommandState('bold') 在 iframe 文档上。

Browsers vary over whether they include the surrounding tags in the selection. They usually don't include the surrounding tags if the selection is entirely contained within the tags. It's possible to walk up the DOM from the start of the selection and check if each element is a <b> tag. But if the iframe you're working with uses contenteditable, there's no guarantee it will bold with <b> tags. There are other ways the text might be bolded: IE usually adds <STRONG> tags to bold, and Firefox and WebKit may use <span style="font-weight:bold>.

It's probably better to use queryCommandState('bold') on the iframe document instead.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文