javascript文本框焦点位置放置于尾部代码实例

当前位置：首页 > 代码实例 > html5 css3代码分类 > 其他 > javascript文本框焦点位置放置于尾部代码实例

在表单文本框内容规范验证的时候，如果不符合规范那么就让文本框获取焦点，如果文本框默认是有文本的话，在不同的浏览器中后去焦点的方式会有所不同，在谷歌中，会将文本框中的内容选中，但是在火狐和IE浏览器中，焦点会位于文本框的最左边，这不够人性化，如果让光标位置位于文本框文本的结尾那就更为人性化一些，下面就通过代码实力介绍一下如何实现次效果。

代码如下:

[ 其他 ] 运行代码下载代码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="https://www.51qianduan.com/" /> 
<title>51前端</title> 
<script type="text/javascript"> 
function getSelectPos(username){
  var username = document.getElementById(username);
  if(username.createTextRange){
    var rtextRange =username.createTextRange();
    rtextRange.moveStart('character',username.value.length);
    rtextRange.collapse(true);
    rtextRange.select();
  }
}
window.onload=function(){
  getSelectPos("username")
}
</script> 
</head> 
<body> 
<form>
<input type="text" name="username" value="51前端" id="username"/>
</form>
</body> 
</html>

代码描述：javascript文本框焦点位置放置于尾部。javascript文本框焦点位置放置于尾部代码实例

下载全部收藏

156 208

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册