使用javascript将所选文本设为粗体
我的标记中有一个文本：
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum condimentum consectetur tellus, at bibendum felis ultrices eu. Nullam nibh urna, euismod a blandit ut, fermentum a leo. Maecenas pharetra elementum fringilla. Quisque condimentum, nibh quis elementum porttitor, magna libero malesuada dolor, ut feugiat tortor lectus ac turpis. Integer tristique molestie enim, sit amet commodo risus tempus non. 当用户选择文本并按CTRL + Enter时，我想用标签包装所选文本。 我得到了所选文本，但无法找到如何用标记包装它。 这是我有的：
function getSelectedText () { if (window.getSelection) { return window.getSelection ().toString (); } else { if (document.selection) { return document.selection.createRange ().text; } } return ''; } $ (document).ready (function() { // User pressed a key $ (document).keydown (function(e) { // is it CTRL+ENTER? if (e.which == 13 && e.ctrlKey) { alert('You have selected ' + getSelectedText ()); // now I need to highlight the text I got // ???? } }); });
请注意！ 一个简单的查找/替换不起作用，如果用户选择了一个可以在文本中找到10次的单个’a’字母，我想突出显示他选择的唯一’a’。 我研究了范围对象，但无法弄清楚如何实现它，请帮助我。
请参阅jsfiddle的演示。
也许这可以帮到你： http ： //code.google.com/p/rangy/
其中一个例子正是你所追求的。
您可以使用document.execCommand()来实现此目的。 这是我对类似问题的回答： Javascript：如何取消环绕内容范围
这适用于（在Chrome中），但只要它只调用一次！
（在http://jsfiddle.net/HaD6k/上运行代码）
$(document).keypress(function(e) { if (e.which == 13 && e.ctrlKey) { var s = getSelection(); var i = s.baseOffset; var j = s.extentOffset; var t = $('div').text(); var t0 = t.substring(0, i) + '' + t.substring(i, j) + '' + t.substring(j); $('div').html(t0); } });
它只运行一次的原因是因为它修改了DOM来添加标签，这意味着下次选择偏移和元素不是连续的。 我还在看那个……