Question

我正在尝试实现一些客户端文本格式化功能。就像任何其他编辑一样。基本上，当用户选择文本并单击粗体时，它应该加粗文本，并且当再次选择相同的文本时，单击粗体。它应该解开它。我可以通过简单地使用jQuery wrap和unwrap函数来实现这个功能。

我遇到的问题是，如果用户选择的文本是周围已经有粗体标签的子串。例如<b>Some text "I am the selection" some text</b>在这种情况下，单击按钮应该解开“我是选择”并保持粗体周围的文本。该项目也建立在angularJS上。

问题：解决这个问题的最佳方法是什么？（我的最后一个选择是将文本作为字符串处理并对其进行手动替换，这是我真正想要避免的）有角度的做法吗？是否有一个好的插件只是为了这个功能（我不想要一个完整的工具栏，因为我已经创建了自己的项目，我只是想要的功能）

http://plnkr.co/edit/KmVBjOeUps302NrdV89k?p=catalogue

Answer 1

我认为你应该可以做这样的事情：

function getSelectedText() {
    if (window.getSelection) {
        return window.getSelection();
    }
    else if (document.selection) {
        return document.selection.createRange().text;
    }
    return '';
}
$(document).ready(function(){
    $("#button").click(function(){
        var myObj = $('#highlight');
        myObj.html( myObj.html().replace(getSelectedText(),
            '<b>'+getSelectedText()+'</b>')
        );
    });
});

其中#highlight是您要从中选择的段落的ID。这只会使该区域变得更加醒目，我将把这个问题留给你;）

如何使用AngularJS实现粗体非扩展功能

1 个答案: