jquery聚焦文本框与扩展文本框聚焦方法


Posted in Javascript onOctober 12, 2012

光标聚焦的位置在最前面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>jquery聚焦文本框 -三水点靠木</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
</head> 
<body> 
<form action="http://www.baidu.com" id="cse-search-box"> 
<div> 
<input type="hidden" name="cx" value="partner-pub-7740261255677392:7064996710" /> 
<input type="hidden" name="ie" value="UTF-8" /> 
<!--文本框--><input type="text" name="q" size="25" /> 
<input type="submit" name="sa" value="搜索" /> 
</div> 
</form> 
<script type="text/javascript"> 
$(document).ready(function () { 
$("input[name='q']").focus(); 
})</script> 
</body> 
</html>

jquery扩展文本框聚焦方法

在不同的浏览器中,一个文本框,如果只是直接给文本框设置focus(),那么光标聚焦的位置可能是在最前面。下面的代码则是给jquery扩展一个textFocus方法,用于聚焦文本框,并使光标在最后,使用$("input").textFocus()。也可以传入一个数字参数,设置光标聚焦的位置。如$("input").textFocus(2),则光标在在第二个字符后面。

(function($){ 
$.fn.textFocus=function(v){ 
var range,len,v=v===undefined?0:parseInt(v); 
this.each(function(){ 
if($.browser.msie){ 
range=this.createTextRange(); //文本框创建范围 
v===0?range.collapse(false):range.move("character",v); //范围折叠 
range.select(); //选中 
}else{ 
len=this.value.length; 
v===0?this.setSelectionRange(len,len):this.setSelectionRange(v,v); //dom直接设置选区,然后focus 
} 
this.focus(); 
}); 
return this; 
} 
})(jQuery)
Javascript 相关文章推荐
greybox——不开新窗口看新的网页
Feb 20 Javascript
javascript 学习之旅 (3)
Feb 05 Javascript
JS 实现完美include载入实现代码
Aug 05 Javascript
JavaScript中对循环语句的优化技巧深入探讨
Jun 06 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
借助FileReader实现将文件编码为Base64后通过AJAX上传
Dec 24 Javascript
javascript实现粘贴qq截图功能(clipboardData)
May 29 Javascript
jQuery双向列表选择器select版
Nov 01 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 Javascript
Vuex简单入门
Apr 19 Javascript
原生小程序封装跑马灯效果
Oct 21 Javascript
vue cli4中mockjs在dev环境和build环境的配置详情
Apr 06 Vue.js
Jquery index()方法 获取相应元素索引值
Oct 12 #Javascript
分享一道笔试题[有n个直线最多可以把一个平面分成多少个部分]
Oct 12 #Javascript
利用谷歌地图API获取点与点的距离的js代码
Oct 11 #Javascript
关于JS控制代码暂停的实现方法分享
Oct 11 #Javascript
JS判断页面加载状态以及添加遮罩和缓冲动画的代码
Oct 11 #Javascript
js函数的延迟加载实现代码
Oct 11 #Javascript
javascript中方便增删改cookie的一个类
Oct 11 #Javascript
You might like
php5.4传引用时报错问题分析
2016/01/22 PHP
php mysql实现mysql_select_db选择数据库
2016/12/30 PHP
php 截取GBK文档某个位置开始的n个字符方法
2017/03/08 PHP
基于逻辑运算的简单权限系统(实现) JS 版
2007/03/24 Javascript
表单项的name命名为submit、reset引起的问题
2007/12/22 Javascript
jQuery的实现原理的模拟代码 -1 核心部分
2010/08/01 Javascript
jQuery EasyUI API 中文文档 - Spinner微调器使用
2011/10/21 Javascript
JQuery实现简单验证码提示解决方案
2012/12/20 Javascript
iframe的父子窗口之间的对象相互调用基本用法
2013/09/03 Javascript
Jquery 数组操作大全个人总结
2013/11/13 Javascript
js判断手机端(Android手机还是iPhone手机)
2015/07/22 Javascript
JavaScript实现节点的删除与序号重建实例
2015/08/05 Javascript
asp.net中oracle 存储过程(图文)
2015/08/12 Javascript
jquery判断对象是否为空并遍历对象的简单实例
2016/07/26 Javascript
深入理解JavaScript和TypeScript中的class
2018/04/22 Javascript
Vue-不允许嵌套式的渲染方法
2018/09/13 Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
2019/03/06 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
2019/04/26 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
2020/08/12 Javascript
Python sys.path详细介绍
2013/10/17 Python
Python利用pandas计算多个CSV文件数据值的实例
2018/04/19 Python
python实现定时发送qq消息
2019/01/18 Python
pytorch获取vgg16-feature层输出的例子
2019/08/20 Python
Python map及filter函数使用方法解析
2020/08/06 Python
html5 touch事件实现页面上下滑动效果【附代码】
2016/03/10 HTML / CSS
世界上最大的巴士旅游观光公司:Big Bus Tours
2016/10/20 全球购物
伦敦一家西班牙童装精品店:La Coqueta
2018/02/02 全球购物
什么是数据库锁?Oracle中都有哪些类型的锁?
2015/08/21 面试题
实体的生命周期
2013/08/31 面试题
法学专业毕业生自荐信范文
2013/12/18 职场文书
合伙协议书范本
2014/04/21 职场文书
如何写股份合作协议书
2014/09/11 职场文书
北京故宫的导游词
2015/01/31 职场文书
兼职安全员岗位职责
2015/02/15 职场文书
幼儿园毕业典礼园长致辞
2015/07/29 职场文书
ORACLE数据库对long类型字段进行模糊匹配的解决思路
2021/04/07 Oracle