JQuery / JavaScript – 从输入或文本区域突出显示部分文本

可能重复：
如何使用Javascript或JQuery突出显示HTML中输入文本字段的一部分

有谁知道如何在input[type=text]或textarea突出显示某些文本？ 可能吗？

Answer 1

您必须在textarea后面放置一个div ，然后根据它的文本设置样式。
备注 ：

• 将textarea background-color为透明，以查看您的highlighter颜色。
• 您的highlighter必须与您的textarea样式和文本内容相同，才能将span放在正确的位置。
• 将您的highlighter文本设置为与其背景相同的颜色，或者您将看到效果， span相同。

HTML ：

 
some text highlighted some text
 some text highlighted some text 

css ：

 .highlighter, textarea { width: 400px; height: 300px; font-size: 10pt; font-family: 'verdana'; } .highlighter { position: absolute; padding: 1px; margin-left: 1px; color: white; } .highlighter span { background: red; color: red; } textarea { position: relative; background-color: transparent; } 

演示

Answer 2

此代码段显示了如何：

 window.onload = function() { var message = document.getElementById('message'); // Select a portion of text createSelection(message, 0, 5); // get the selected portion of text var selectedText = message.value.substring(message.selectionStart, message.selectionEnd); alert(selectedText); }; function createSelection(field, start, end) { if( field.createTextRange ) { var selRange = field.createTextRange(); selRange.collapse(true); selRange.moveStart('character', start); selRange.moveEnd('character', end); selRange.select(); } else if( field.setSelectionRange ) { field.setSelectionRange(start, end); } else if( field.selectionStart ) { field.selectionStart = start; field.selectionEnd = end; } field.focus(); }