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 相关文章推荐
js倒计时小程序
Nov 05 Javascript
使用JavaScript判断图片是否加载完成的三种实现方式
May 04 Javascript
javascript浏览器兼容教程之事件处理
Jun 09 Javascript
js使用正则实现ReplaceAll全部替换的方法
Jul 18 Javascript
Node.js与Sails redis组件的使用教程
Feb 14 Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
Feb 17 Javascript
轻松理解JavaScript闭包
Mar 14 Javascript
Vue动态加载异步组件的方法
Nov 21 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
Vue 设置axios请求格式为form-data的操作步骤
Oct 29 Javascript
JavaScript实现移动小精灵的案例代码
Dec 12 Javascript
详细谈谈JavaScript中循环之间的差异
Aug 23 Javascript
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
php 5.3.5安装memcache注意事项小结
2011/04/12 PHP
PHP表单提交表单名称含有点号(.)则会被转化为下划线(_)
2011/12/14 PHP
PHP autoload与spl_autoload自动加载机制的深入理解
2013/06/05 PHP
PHP IDE phpstorm 常用快捷键
2015/05/18 PHP
PHP可变变量学习小结
2015/11/29 PHP
详解WordPress中添加友情链接的方法
2016/05/21 PHP
Yii2中简单的场景使用介绍
2017/06/02 PHP
ExtJs中简单的登录界面制作方法
2010/08/19 Javascript
Fixie.js 自动填充内容的插件
2012/06/28 Javascript
js 固定悬浮效果实现思路代码
2013/08/02 Javascript
jQuery 中DOM 操作详解
2015/01/13 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
2016/10/30 Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
2019/07/10 Javascript
Layui弹出层 加载 做编辑页面的方法
2019/09/16 Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
2020/07/20 Javascript
Python求导数的方法
2015/05/09 Python
pyqt5对用qt designer设计的窗体实现弹出子窗口的示例
2019/06/19 Python
python设置随机种子实例讲解
2019/09/12 Python
python有几个版本
2020/06/17 Python
HTML5 Canvas实现360度全景图的示例代码
2018/01/29 HTML / CSS
Lacoste美国官网:经典POLO衫品牌
2016/10/12 全球购物
墨尔本照明批发商店:Mica Lighting
2017/12/28 全球购物
Vision Direct比利时:在线订购隐形眼镜
2019/08/27 全球购物
好的自荐信的要求
2013/10/30 职场文书
岗位竞聘演讲稿
2014/01/10 职场文书
广告学毕业生求职信
2014/01/30 职场文书
酒店总经理岗位职责范本
2014/08/08 职场文书
水利专业大学生职业生涯规划书范文
2014/09/17 职场文书
2014年流动人口工作总结
2014/11/26 职场文书
综合素质评价个性发展自我评价
2015/03/06 职场文书
2015年护士长个人工作总结
2015/04/24 职场文书
老人节主持词
2015/07/04 职场文书
2016秋季运动会前导词
2015/11/25 职场文书
MySQL一些常用高级SQL语句
2021/07/03 MySQL
Java 深入探究讲解简单工厂模式
2022/04/07 Java/Android