[英]How can I highlight a subset of the text in an input box?
I'm trying to figure out if it's possible using Javascript to highlight a specific range of data in a text field. 我试图弄清楚是否可以使用Javascript来突出显示文本字段中的特定数据范围。
textfield.select();
That ^^ works to select the entire text, but for all my googling I haven't stumbled upon a way to select, for example, characters 2 through 10 of the entered text. ^^用于选择整个文本,但对于我的所有谷歌搜索,我没有偶然发现选择的方法,例如,输入文本的字符2到10。 Is this possible? 这可能吗?
This is handled differently with IE vs everyone else. IE与其他人的处理方式不同。
Here is a reference guide with examples: 以下是参考指南,其中包含示例:
http://www.sxlist.com/techref/language/html/ib/Scripting_Reference/trange.htm http://www.sxlist.com/techref/language/html/ib/Scripting_Reference/trange.htm
I think there is a very IE-specific way to do it that involves TextRange objects. 我认为有一种非常特定于IE的方法,它涉及TextRange对象。
Here's some documentation on the TextRange object. 这是TextRange对象的一些文档。
After posting I realized that this might only work on a textarea. 发布后我意识到这可能只适用于textarea。
This object will let you get, set & modify the selected region of a text box. 此对象将允许您获取,设置和修改文本框的选定区域。
function SelectedText(input) {
// Replace the currently selected text with the given value.
this.replace = function(text) {
var selection = this.get();
var pre = input.value.substring(0, selection.start);
var post = input.value.substring(selection.end, input.value.length);
input.value = pre + text + post;
this.set(selection.start, selection.start + text.length);
return this;
}
// Set the current selection to the given start and end points.
this.set = function(start, end) {
if (input.setSelectionRange) {
// Mozilla
input.focus();
input.setSelectionRange(start, end);
} else if (input.createTextRange) {
// IE
var range = input.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
}
return this;
}
// Get the currently selected region.
this.get = function() {
var result = new Object();
result.start = 0;
result.end = 0;
result.text = '';
if (input.selectionStart != undefined) {
// Mozilla
result.start = input.selectionStart;
result.end = input.selectionEnd;
} else {
// IE
var bookmark = document.selection.createRange().getBookmark()
var selection = inputBox.createTextRange()
selection.moveToBookmark(bookmark)
var before = inputBox.createTextRange()
before.collapse(true)
before.setEndPoint("EndToStart", selection)
result.start = before.text.length;
result.end = before.text.length + selection.text.length;
}
result.text = input.value.substring(result.start, result.end);
return result;
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.