鼠标手动选择文本后显示
1. 选择表单文本selectionStart,selectionEnd
<textarea name="textarea" id="text" cols="30" rows="10"></textarea>
text.onselect = function(){
var s = this.value.substring(this.selectionStart,this.selectionEnd);
console.log(s);
}
2. IE11以下版本document.selection.createRange
text.onselect = function(){
var s = document.selection.createRange().text;
console.log(s);
}
JavaScript选择文本后显示
1. H5获取表单文本setSelectionRange
var s = text.setSelectionRange(0,text.value.length);//s为text的value,但是页面上并不会有选择文本的的标志。可让文本框获取焦点以在页面显示。
text.setSelectionRange(0,Math.ceil(text.value.length/2));
text.focus();
setSelectionRange
和focus
都会触发onselect
事件。
2. IE createTextRange
text.value = '0123456789';
var range = text.createTextRange();
range.collapse(true);//参数默认为true,将选择开始的位置设置为当前选中区域的开始,未选中之前为0,参数为false时将选择开始的位置设置为当前选中区域的末尾。
range.moveStart('character',1);//开始位置索引,character表示以字符为单位
range.moveEnd('character',2);//结束位置索引
range.select();//相当于focus,文本12高亮;
range.collapse(false);//将文本12的结束位置当做开始位置
range.moveStart('character',4);//第四个字符为7
range.moveEnd('character',2);//选择文本78
range.select();
若选择到后面没有字符可以选择则光标停留在最后一个字符后面,未选中任何字符