7

我目前正在实现非常酷的范围和选择库 Rangy.js。我想实现一个可以突出显示某些文本的功能,然后将注释添加并保存到突出显示。在演示中,它展示了如何向选择添加注释 - 但只有一个 ID 附加到选择。

我正在尝试这样的事情,我在元素上创建一个评论属性:

highlighter.addClassApplier(rangy.createCssClassApplier("highlight", {
    ignoreWhiteSpace: true,
    elementTagName: "span",
    elementProperties: {
        comment: "",
        onclick: function() {             
            var highlight = highlighter.getHighlightForElement(this);
            $('#myModal p').text( highlight.classApplier.elementProperties.comment );
            $('#myModal').modal('show');
        }
    }
}));

然后在突出显示文本时,注释存储在“comment”属性中:

function highlightSelectedText( event ) {
    event.preventDefault();

    var highlight = highlighter.highlightSelection("highlight");

    $('#myModal').modal('show');

    $('#save-comment').on('click', function () {
        var comment = $('#comment-text');
        highlight[0].classApplier.elementProperties.comment = comment.val();
    });
  }

当我序列化我的亮点时,评论不包括在内。

有没有人用 Rangy.js 尝试过这个或类似的东西?

任何帮助表示赞赏,在此先感谢!

4

0 回答 0