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 相关文章推荐
syntaxhighlighter 使用方法
Jul 02 Javascript
javascript对数组的常用操作代码 数组方法总汇
Jan 27 Javascript
js自动闭合html标签(自动补全html标记)
Oct 04 Javascript
JavaScript中的Math.atan2()方法使用详解
Jun 15 Javascript
深入浅析AngularJS中的module(模块)
Jan 04 Javascript
select下拉框插件jquery.editable-select详解
Jan 22 Javascript
vue双向绑定简要分析
Mar 23 Javascript
webpack自动打包和热更新的实现方法
Jun 24 Javascript
Vue-cli3.X使用px2 rem遇到的问题及解决方法
Aug 08 Javascript
js中关于Blob对象的介绍与使用
Nov 29 Javascript
vue 移动端记录页面浏览位置的方法
Mar 11 Javascript
JavaScript实现横版菜单栏
Mar 17 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
经典的星际争霸,满是回忆的BGM
2020/04/09 星际争霸
自己做矿石收音机
2021/03/02 无线电
js下函数般调用正则的方法附代码
2008/06/22 PHP
PHP与SQL注入攻击防范小技巧
2011/09/16 PHP
在 Laravel 中 “规范” 的开发短信验证码发送功能
2017/10/26 PHP
Extjs显示从数据库取出时间转换JSON后的出现问题
2012/11/20 Javascript
jQuery获取浏览器中的分辨率实现代码
2013/04/23 Javascript
jQuery操作Select的Option上下移动及移除添加等等
2013/11/18 Javascript
js输出阴历、阳历、年份、月份、周示例代码
2014/01/29 Javascript
Angular中的Promise对象($q介绍)
2015/03/03 Javascript
谈谈impress.js初步理解
2015/09/09 Javascript
jQuery实现的网页左侧在线客服效果代码
2015/10/23 Javascript
javascript数组克隆简单实现方法
2015/12/16 Javascript
解析Node.js异常处理中domain模块的使用方法
2016/02/16 Javascript
ajax在兼容模式下失效的快速解决方法
2016/03/22 Javascript
通过npm引用的vue组件使用详解
2017/03/02 Javascript
jQuery+koa2实现简单的Ajax请求的示例
2018/03/06 jQuery
webpack源码之loader机制详解
2018/04/06 Javascript
Nuxt升级2.0.0时出现的问题(小结)
2018/10/08 Javascript
解决vue组件中click事件失效的问题
2019/11/09 Javascript
Python内置的字符串处理函数详细整理(覆盖日常所用)
2014/08/19 Python
Python MySQLdb 使用utf-8 编码插入中文数据问题
2018/03/13 Python
pytorch 实现在一个优化器中设置多个网络参数的例子
2020/02/20 Python
Python爬虫谷歌Chrome F12抓包过程原理解析
2020/06/04 Python
如何用 Python 处理不平衡数据集
2021/01/04 Python
Nº21官方在线商店:numeroventuno.com
2019/09/26 全球购物
英国钻石公司:British Diamond Company
2020/02/16 全球购物
打造高效课堂实施方案
2014/03/22 职场文书
贺卡寄语大全
2014/04/11 职场文书
纺织工程专业推荐信
2014/09/08 职场文书
学生意外伤害赔偿协议书
2014/09/17 职场文书
“四风”问题整改措施和努力方向
2014/09/20 职场文书
2014年机关作风建设工作总结
2014/10/23 职场文书
九寨沟导游词
2015/02/02 职场文书
技术员岗位职责
2015/02/04 职场文书
详解Django中 render() 函数的使用方法
2021/04/22 Python