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 相关文章推荐
jQuery实现页面滚动时层智能浮动定位实例探讨
Mar 29 Javascript
JavaScript获取图片真实大小代码实例
Sep 24 Javascript
简要了解jQuery移动web开发的响应式布局设计
Dec 04 Javascript
jquery.validate 自定义验证方法及validate相关参数
Jan 18 Javascript
JavaScript 最佳实践:帮你提升代码质量
Dec 03 Javascript
微信小程序 textarea 组件详解及简单实例
Jan 10 Javascript
Vue中fragment.js使用方法详解
Mar 09 Javascript
jQuery使用正则验证15/18身份证的方法示例
Apr 27 jQuery
get  post jsonp三种数据交互形式实例详解
Aug 25 Javascript
vue实现中部导航栏布局功能
Jul 30 Javascript
ES5新增数组的实现方法
May 12 Javascript
jquery实现简单拖拽效果
Jul 20 jQuery
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
全国FM电台频率大全 - 29 青海省
2020/03/11 无线电
简单的PHP缓存设计实现代码
2011/09/30 PHP
php的declare控制符和ticks教程(附示例)
2014/03/21 PHP
php Imagick获取图片RGB颜色值
2014/07/28 PHP
php使用ftp远程上传文件类(完美解决主从文件同步问题的方法)
2016/09/23 PHP
基于yaf框架和uploadify插件,做的一个导入excel文件,查看并保存数据的功能
2017/01/24 PHP
laravel框架模型和数据库基础操作实例详解
2020/01/25 PHP
PHP设计模式(七)组合模式Composite实例详解【结构型】
2020/05/02 PHP
jQuery弹性滑动导航菜单实现思路及代码
2013/05/02 Javascript
jQuery 中的 DOM 操作
2016/04/26 Javascript
jquery插件格式实例分析
2016/06/16 Javascript
Bootstrap基本组件学习笔记之下拉菜单(7)
2016/12/07 Javascript
完美解决浏览器跨域的几种方法(汇总)
2017/05/08 Javascript
以BootStrap Tab为例写一个前端组件
2017/07/25 Javascript
vue-cli扩展多模块打包的示例代码
2018/04/09 Javascript
layui-laydate时间日历控件使用方法详解
2018/11/15 Javascript
Angular(5.2-&gt;6.1)升级小结
2018/12/27 Javascript
JavaScript变量Dom对象的所有属性
2020/04/30 Javascript
微信小程序实现底部弹出模态框
2020/11/18 Javascript
[40:04]Secret vs Infamous 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.23
2019/09/05 DOTA
Python 序列化 pickle/cPickle模块使用介绍
2014/11/30 Python
深入理解Python中命名空间的查找规则LEGB
2015/08/06 Python
python的Tqdm模块的使用
2018/01/10 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
2019/01/23 Python
Python二维数组实现求出3*3矩阵对角线元素的和示例
2019/11/29 Python
Windows10+anacond+GPU+pytorch安装详细过程
2020/03/24 Python
在TensorFlow中实现矩阵维度扩展
2020/05/22 Python
Python面向对象特殊属性及方法解析
2020/09/16 Python
日本食品网上商店:JaponShop.com
2017/11/28 全球购物
Java程序员面试题
2013/07/15 面试题
采购助理岗位职责
2014/02/16 职场文书
公司法人授权委托书范本
2014/09/12 职场文书
公积金接收函格式
2015/01/30 职场文书
党风廉政教育心得体会2016
2016/01/22 职场文书
SQL实现LeetCode(177.第N高薪水)
2021/08/04 MySQL
Python if else条件语句形式详解
2022/03/24 Python