正文
js实现默认或者触发一个事件选中元素内容的方法
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
方法一：非文本框、文本域的选中内容方法
<!Doctype html>
<html>
<head>
<script type="text/javascript" src='http://libs.baidu.com/jquery/2.0.0/jquery.js'></script>
<body>
<div onclick="SelectText('myDiv')">点击选中</div>
<div id="myDiv">
测试选中内容<p>eee</p>
测试
</div>
<script>
function SelectText(element) {
var browserName=navigator.userAgent.toLowerCase();
var text = document.getElementById(element);
if (/msie/i.test(browserName) && !/opera/.test(browserName)) {
var range = document.body.createTextRange();
range.moveToElementText(text);
range.select();
} else {
var selection = window.getSelection();
var range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
selection.addRange(range);
//苹果浏览器下，现已经不支持html的内容
// var selection = window.getSelection();
// selection.setBaseAndExtent(text, 0, text, 1);
}
}
</script>
</body>
</html>
方法二：文本区、文本框选中内容方法（文本域和文本框与其他html标签选中的方法不一样）
<!Doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>选中文本</title>
<style type="text/css">
body{ font-size:12px;}
</style>
</head>
<body>
<input type="text" id="song" value="在解放路松岛枫424" />
</body>
</html>
<script>
/*
1. 只受用于一些含有value属性的HTML控件，例如单行文本框、多行文本域；
2. 后面两个参数表示起始字符位置与结束的字符位置，如果位置值为空，或是非数值，则会（从头或至尾或全部）选择字符；
3. 支持负值，负值表意与js中的slice属性一致，负值表示的含义就是负值与字符总长度的和，也可以理解为从末尾开始选择；
4. 如果数值范围超过字符总长，则无内容选择；
5. 支持单参数，省略第三个参数表示一致到字符结束都要选中。
*/
var textSelect = function(o, a, b){
//o是当前对象，例如文本域对象
//a是起始位置，b是终点位置
var a = parseInt(a, 10), b = parseInt(b, 10);
var l = o.value.length;
if(l){
//如果非数值，则表示从起始位置选择到结束位置
if(!a){
a = 0;
}
if(!b){
b = l;
}
//如果值超过长度，则就是当前对象值的长度
if(a > l){
a = l;
}
if(b > l){
b = l;
}
//如果为负值，则与长度值相加
if(a < 0){
a = l + a;
}
if(b < 0){
b = l + b;
}
if(o.createTextRange){//IE浏览器
var range = o.createTextRange();
range.moveStart("character",-l);
range.moveEnd("character",-l);
range.moveStart("character", a);
range.moveEnd("character",b);
range.select();
}else{
o.setSelectionRange(a, b);
o.focus();
}
}
};
document.onclick = function(){
var textElem = document.getElementById("song");
textSelect(textElem, 0, 5);
}</script>
