如何獲得選定的文本ID和替換文本保持標記完整的JavaScript？

我正在創造通過字着色工具的單詞。基本上，用戶可以從單詞中選擇幾個字母並將它們分隔開來，因此一個單詞可以有兩種或更多種顏色。如何獲得選定的文本ID和替換文本保持標記完整的JavaScript？

要跟蹤所有的單詞，他們都有身份證，我想知道我怎麼知道什麼字母被選中，並且如果用戶選擇了多個單詞，那裏有什麼字id，所以我應該得到每個單詞的ID與它。

我可以選擇，但我不知道如何找到有ID的所選單詞。

2012-03-03 Basit

獲取ID。代碼只是爲了概念，沒有完全開發

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/

來源

2012-03-03 02:35:03 charlietfl

我怎麼能得到多個單詞的多選擇單詞，如嘗試選擇'oloring工具'它應該返回4和5編號 – Basit 2012-03-03 02:38:23

你將需要深入到範圍的東西，而不是我在https：// developer.mozilla.org/en/DOM/range – charlietfl 2012-03-03 02:43:49

http://jsfiddle.net/8Gqsu/2/我嘗試mousedown，並有一個錯字，現在工作 – charlietfl 2012-03-03 02:48:02

由event.target屬性得到它 - 看到你的數據-id屬性，tetx從文本（）方法http://jsfiddle.net/FvnPS/31/

來源

2012-03-03 02:31:42 MyStream

如果我選擇「字顏色」那隻能說明「色」字，其即時通訊假設只得到着色ID，但不是字標識。我錯了嗎？ – Basit 2012-03-03 02:36:33

這是因爲它是在鼠標上觸發的。但是，如果您希望從鼠標向下獲取任何單詞，然後添加一個mousedown事件檢測，然後您可以獲取mosuedown事件和mouseup事件的id，並且它們之間的所有元素都將成爲higlighted的單詞。如果它是相同的ID，那麼所有的好:)同一個單詞，否則你可能需要使用.index（）檢查單詞的索引，以查看哪個方法來讀取元素（單詞）以使訂單正確。 – MyStream 2012-03-03 02:39:17

我最後一件事情得到解決。我怎樣才能得到所選的文字，包括它的html標籤？ – Basit 2012-03-03 02:49:45

這會給你選擇的第一個字的ID（first_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/

來源

2012-03-03 02:40:37 Nathanael

如何獲得選定的文本ID和替換文本保持標記完整的JavaScript？

回答

相關問題