js实现文本框中焦点在最后位置

 更新时间:2014年03月04日 09:27:40   作者:  
本篇文章主要是对js实现文本框中焦点在最后位置的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所 帮助

在一般的程序中.程序员做输入框内容正确性检测时一般喜欢通过判断内容的合法性来确定焦点框.

如:

复制代码 代码如下:

if(obj.value==""){
   obj.focus();
   return false;
}

这样当哪一项输入框为空是就将焦点移动那一项输入框..这项功能使用起来非常方便..但是存在一个小小的问题...

那就是obj.focus()将焦点移动到输入框后,会将文字光标(就是一闪一闪的竖线)移动到这个输入框的第一个字符的位置...就上面的判断而言..如果文本框中没有内容..obj.focus正好可以满足我们直接在文本框中输入内容而不用点击一下文本框以使文本有焦点...

但是,如果文本框中已经有内容了..但是这个内容不合法.obj.focus()同样的将光标移动到了这个文本框的第一个字符的位置..这时就会让注意用户体验的设计师郁闷了...我们需要的是文本框得到焦点,然后文字光标移动到文本框的最后,让用户可以不用点击文本框直接输入内容..输入的内容会在原来的内容的后面追加起来..

下面的代码可以完成这个小细节:

复制代码 代码如下:

<script language="javascript">
function getSelectPos(obj){
var esrc = document.getElementById(obj);
if(esrc==null){
   esrc=event.srcElement;
}
var rtextRange =esrc.createTextRange();
rtextRange.moveStart('character',esrc.value.length);
rtextRange.collapse(true);
rtextRange.select();
}
</script>

这个代码是在用户体验的细节性上会对设计师有很大的帮助...

相关文章

  • js实现带缓动动画的导航栏效果

    js实现带缓动动画的导航栏效果

    本篇文章主要分享了js实现带缓动动画的导航栏效果的示例代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • TypeScript中类型兼容性的示例详解

    TypeScript中类型兼容性的示例详解

    JavaScript是一门弱类型语言,它对类型是弱校验,所以才有了TypeScript。本文就来和大家一起看看TypeScript的类型兼容性的概念和分类,需要的可以参考一下
    2022-08-08
  • preact组件案例的使用详解

    preact组件案例的使用详解

    SelectValue是一个Preact组件,用于创建一个下拉选择框,它接收props如value、setfn、options和disabled,用于更新父组件中的值、处理下拉选择框的值改变事件、显示选项和禁用或启用下拉选择框,本文介绍preact组件案例的使用详解,感兴趣的朋友一起看看吧
    2025-03-03
  • 使用jscript实现二进制读写脚本代码

    使用jscript实现二进制读写脚本代码

    Reading And Writing Binary Files Using JScript正如我刚才推什么我能做的JScript中,我想出了对问题的二进制文件。以下级的解决,这为小到中等大小的文件。我的部分包括这个职位在这里,因为我即将付诸表决,在一个职位约发送带有附件的电邮通过JScript和它会使用这个二进制文件码来读取,在二进制附件档案。
    2008-06-06
  • javascript单张多张图无缝滚动实例代码

    javascript单张多张图无缝滚动实例代码

    在本篇文章里小编给大家分享的是关于javascript单张多张图无缝滚动实例代码和实例,需要的朋友们可以参考下。
    2020-05-05
  • JavaScript将数字转换成大写中文的方法

    JavaScript将数字转换成大写中文的方法

    这篇文章主要介绍了JavaScript将数字转换成大写中文的方法,涉及javascript字符串及匹配的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • 利用js判断数据是否是数组或字符串的常见方法

    利用js判断数据是否是数组或字符串的常见方法

    这篇文章主要给大家介绍了关于利用js判断数据是否是数组或字符串的常见方法,其实有很多方法可以判断数据是否是数组或字符串,需要的朋友可以参考下
    2023-07-07
  • SyntaxHighlighter语法高亮插件使用说明

    SyntaxHighlighter语法高亮插件使用说明

    SyntaxHighlighter语法高亮插件使用说明,需要的朋友可以参考下。
    2011-08-08
  • 原生JS实现DOM加载完成马上执行JS代码的方法

    原生JS实现DOM加载完成马上执行JS代码的方法

    今天小编就为大家分享一篇原生JS实现DOM加载完成马上执行JS代码的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • 用Javascript实现发送短信验证码间隔功能

    用Javascript实现发送短信验证码间隔功能

    这篇文章主要介绍了用Javascript实现发送短信验证码间隔功能,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-02-02

最新评论