jQuery/JavaScript-高亮显示输入或文本区域中的一部分文本 [英] JQuery/JavaScript - highlight a part of text from input or textarea

问题描述

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

Possible Duplicate:
How to highlight a part part of an Input text field in HTML using Javascript or JQuery

有人知道如何突出显示input[type=text]或textarea中的某些文本吗? 有可能吗?

Does anyone know how to highlight some text in input[type=text] or textarea? Is it possible?

推荐答案

您必须在textarea后面放置一个div，然后根据其文本设置样式.
注释:

You have to place a div behind your textarea and then style it according to it's text.
Notes:

• 将textarea background-color设置为透明以查看您的highlighter颜色.
• 您的highlighter必须具有与textarea相同的样式和文本内容，才能将span放置在正确的位置.
• 将highlighter文本设置为与背景相同的颜色，否则您会看到<b>效果，与span相同.

• Set your textarea background-color to transparent to see your highlighter color.
• Your highlighter have to be the same style and text content of your textarea to put the span on the right place.
• Set your highlighter text to the same color of it's background or you'll see a <b> effect, the same for the span.

html :

<div class="highlighter">some text <span>highlighted</span> some text</div>
<textarea>some text highlighted some text</textarea>

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;
}

演示

这篇关于jQuery/JavaScript-高亮显示输入或文本区域中的一部分文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！