js移动焦点到最后
当输入框(input/textarea)获得焦点时,将焦点移动到最后,在某些情况下用户体验很好。网上的大部分方法都是针对IE浏览器的。代码如下:
var range = el.createTextRange();
range.moveStart('character', el.value.length);
range.collapse(false);
range.select();
其实可以将moveStart这行删除,因为createTextRange方法创建range后,利用collapse方法,参数为false就可以移动到最后了。collapse(true)移动光标到range的开始,collapse(false)移动光标到range的结尾。 Firefox等标准浏览器可以使用w3c的setSelectionRange方法。代码如下:
if (el.setSelectionRange) {
el.focus();
el.setSelectionRange(el.value.length, el.value.length)
} else {
range = el.createTextRange();
range.collapse(false);
range.select();
}
注意setSelectionRange方法仅适用于input/textarea元素。其它非原生的可编辑元素的焦点移到可以利用selection对象的collapse方法,例如:
sel = window.getSelection();
sel.collapse(el, 1);
el.focus();
js移动焦点到最后的更多相关文章
- JS实现焦点图轮播效果
大家平时逛淘宝网的时候,在首页就能看到焦点图轮播的效果,就是这个样子的: PS:想起每每打开淘宝,总会被这个玩意先夺眼球,偶尔还去点进去溜溜,幸好我定力好,总能控制住自己的购买欲望,为自己不用剁手感到 ...
- js中焦点的含义是什么
焦点即是光标 焦点是在页面上屏幕中闪动的的小竖线,鼠标点击可获得光标,Tab键可按照设置的Tabindex切换焦点
- 使用JS取得焦点(focus)元素
原文链接: Get the Focused Element with JavaScript 原文日期: 2014年3月19日 翻译日期: 2014年3月21日 翻译人员: 铁锚 对于良好的用户体验来说 ...
- js获得焦点和失去焦点那些事
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...
- js 设置焦点 判断控件是否获得焦点 判断哪个控件获得焦点
设置焦点 <html> <head> <title>设置焦点</title> <mce:script language ="javasc ...
- JS+css3焦点轮播图PC端
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js失去焦点触发
onblur="displayRest($(this))"
- JS、JQ实现焦点图轮播效果
JS实现焦点图轮播效果 效果图: 代码如下,复制即可使用: (不过里面的图片路径需要自己改成自己的图片路径,否则是没有图片显示的哦) <!DOCTYPE html> <html> ...
- js可以关闭android页面上的键盘输入法
尝试让获取焦点的元素失去焦点,document.activeElement.blur() js实现焦点进入文本框内关闭输入法:imeMode2011-05-26 11:23要用到的东西: imeMod ...
随机推荐
- yii2 单页面增删改
视图层 <style>#tab tr td{ height:40px; width:100px;}</style><form action="ind ...
- PHP header()函数
对header函数,我用得最多的就是跳转页面和设置字符集,其他的功能用得比较少. 一.设置字符集 其实我们用的最多的在在html代码当中的<meta>标签里面设置字符集.格式如下: < ...
- simple grammer
<?phpecho strlen("Hello world!"); // outputs 12?> <?phpecho str_word_count(" ...
- HDU 4576
http://acm.hdu.edu.cn/showproblem.php?pid=4576 题意:给一个1-n的环,m次操作,每次操作顺时针或逆时针走w步,求最后落在[l,r]区间的概率 dp[i] ...
- iOS开发主要参考文档(转载)
Objective-C,语言的系统详细资料.这是做iOS开发的前题与基础.https://developer.apple.com/library/ios/#documentation/Cocoa/Co ...
- Redis 3.0 集群搭建
Redis 3.0 集群搭建 开启两个虚拟机 分别在两个虚拟机上开启3个Redis实例 3主3从两个虚拟机里的实例互为主备 下面分别在两个虚拟机上安装,网络设置参照codis集群的前两个主机 分别关闭 ...
- 【题解】【矩阵】【回溯】【Leetcode】Unique Paths II
A robot is located at the top-left corner of a m x n grid (marked 'Start' in the diagram below). The ...
- 【题解】【BST】【Leetcode】Convert Sorted Array to Binary Search Tree
Given an array where elements are sorted in ascending order, convert it to a height balanced BST.思路: ...
- 112. Path Sum
Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that adding up all ...
- AXIOM
AXIOM是一个实现了延迟构造和拉(pull parsing)解析的轻量级的xml解析器 http://reeboo.iteye.com/blog/317391 http://reeboo.iteye ...