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

How to get selected text id and replace the text with keeping the tags intact with javascript?

本文关键字：文本 替换 javascript 并用 标签 id 获取 何获取      更新时间：2023-09-26

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

为了跟踪所有的单词，它们都有id，我想知道如何知道选择了哪些字母，以及所选单词有什么单词id，如果用户选择了多个单词，那么我应该用它来获取每个单词的id。

这里是演示：http://jsfiddle.net/FvnPS/29/

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

从您的数据ID属性中获取ID，从text（）方法中获取tetx。代码仅用于概念，未完全开发

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/

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

这将为您提供所选第一个单词的id（first_id）和最后一个单词的id（last_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/

相关文章：