Question

我正在创建逐字着色工具。基本上，用户可以从单词中选择几个字母并将它们分开，因此一个单词可以有两种或更多种颜色。

要跟踪所有的单词，他们都有id，我想知道我怎么知道选择了什么字母以及选择单词的单词id是什么，如果用户选择了多个单词，那么我应该得到每个单词单词id与它。

我可以得到选择，但我不知道如何为所选单词找到id。

Answer 1

从data-id属性获取ID，从text（）方法获取文本。代码仅用于概念，尚未完全开发

alert($(this).text() +' ID: '+$(this).data('id'));

编辑：开始/结束ID

var id = {
    start: null,
    end: null
}


$('word').mouseup(function() {
    alert(getSelectedText() + ' End: ' + $(this).data('id') + ' Start: ' + id.start);
}).mousedown(function(evt) {
    id.start = $(evt.target).data('id')
});

http://jsfiddle.net/8Gqsu/2/

Answer 2

通过event.target属性获取 - 请参阅http://jsfiddle.net/FvnPS/31/

Answer 3

这将为您提供所选第一个单词的ID（ first_id ）和最后一个单词（ last_id ）的ID，显然选中其中的所有单词同样。如果只选择了一个单词，则它们都具有相同的值。

$('word').mouseup(function(event) {
    var last_id = parseInt($(this).attr("data-id"));
    var first_id = last_id - getSelectedText().split(" ").length + 1;
});

function getSelectedText() {
    if (window.getSelection) {
        return window.getSelection().toString();
    } else if (document.selection) {
        return document.selection.createRange().text;
    }
    return '';
}

http://jsfiddle.net/vTgqW/2/

如何获取选定的文本ID并用javascript保持标签完整来替换文本？

3 个答案: