JavaScript选择文本方法

鼠标手动选择文本后显示

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();

若选择到后面没有字符可以选择则光标停留在最后一个字符后面，未选中任何字符