基于jQuery的输入框在光标位置插入内容, 并选中


Posted in Javascript onOctober 29, 2011
// 
//使用方法 
//$(文本域选择器).insertContent("插入的内容"); 
//$(文本域选择器).insertContent("插入的内容",数值); //根据数值选中插入文本内容两边的边界, 数值: 0是表示插入文字全部选择,-1表示插入文字两边各少选中一个字符。 
// 
//在光标位置插入内容, 并选中 
(function($) { 
$.fn.extend({ 
insertContent: function(myValue, t) { 
var $t = $(this)[0]; 
if (document.selection) { //ie 
this.focus(); 
var sel = document.selection.createRange(); 
sel.text = myValue; 
this.focus(); 
sel.moveStart('character', -l); 
var wee = sel.text.length; 
if (arguments.length == 2) { 
var l = $t.value.length; 
sel.moveEnd("character", wee + t); 
t <= 0 ? sel.moveStart("character", wee - 2 * t - myValue.length) : sel.moveStart("character", wee - t - myValue.length); 
sel.select(); 
} 
} else if ($t.selectionStart || $t.selectionStart == '0') { 
var startPos = $t.selectionStart; 
var endPos = $t.selectionEnd; 
var scrollTop = $t.scrollTop; 
$t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos, $t.value.length); 
this.focus(); 
$t.selectionStart = startPos + myValue.length; 
$t.selectionEnd = startPos + myValue.length; 
$t.scrollTop = scrollTop; 
if (arguments.length == 2) { 
$t.setSelectionRange(startPos - t, $t.selectionEnd + t); 
this.focus(); 
} 
} 
else { 
this.value += myValue; 
this.focus(); 
} 
} 
}) 
})(jQuery);
Javascript 相关文章推荐
js限制文本框只能输入数字方法小结
Jun 16 Javascript
Javascript学习指南
Dec 01 Javascript
javascript使用正则表达式检测IP地址
Dec 03 Javascript
轻松实现javascript数据双向绑定
Nov 11 Javascript
js组件SlotMachine实现图片切换效果制作抽奖系统
Apr 17 Javascript
学习AngularJs:Directive指令用法(完整版)
Apr 26 Javascript
js 获取范围内的随机数实例代码
Aug 02 Javascript
JS实现十字坐标跟随鼠标效果
Dec 25 Javascript
轻松搞定jQuery+JSONP跨域请求的解决方案
Mar 06 jQuery
AngularJS实现动态切换样式的方法分析
Jun 26 Javascript
WebGL three.js学习笔记之阴影与实现物体的动画效果
Apr 25 Javascript
JavaScript实现密码强度实时验证
Mar 18 Javascript
基于jquery的无限级联下拉框js插件
Oct 29 #Javascript
对setInterval在火狐和chrome切换标签产生奇怪的效果之探索,与解决方案!
Oct 29 #Javascript
仿猪八戒网左下角的文字滚动效果
Oct 28 #Javascript
js实现双向链表互联网机顶盒实战应用实现
Oct 28 #Javascript
js常用代码段收集
Oct 28 #Javascript
jWiard 基于JQuery的强大的向导控件介绍
Oct 28 #Javascript
理解JSON:3分钟课程
Oct 28 #Javascript
You might like
dedecms系统常用术语汇总
2007/04/03 PHP
PHP 反向排序和随机排序代码
2010/06/30 PHP
ThinkPHP模板自定义标签使用方法
2014/06/26 PHP
Laravel如何自定义command命令浅析
2019/03/23 PHP
extJs 下拉框联动实现代码
2010/04/09 Javascript
多种方法实现JS动态添加事件
2013/11/01 Javascript
js css 实现遮罩层覆盖其他页面元素附图
2014/09/22 Javascript
JS事件添加和移出的兼容写法示例
2016/06/20 Javascript
详解Vue路由History mode模式中页面无法渲染的原因及解决
2017/09/28 Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
2019/03/06 Javascript
微信网页登录逻辑与实现方法
2019/04/29 Javascript
JavaScript使用面向对象实现的拖拽功能详解
2019/06/12 Javascript
layui实现把数据表格时间戳转换为时间格式的例子
2019/09/12 Javascript
[04:36]DOTA2国际邀请赛 ti3精彩集锦
2013/08/19 DOTA
[04:49]期待西雅图之战 2016国际邀请赛中国区预选赛WINGS战队赛后采访
2016/06/29 DOTA
Python连接SQLServer2000的方法详解
2017/04/19 Python
Django压缩静态文件的实现方法详析
2018/08/26 Python
python 自动重连wifi windows的方法
2018/12/18 Python
Python+OpenCV图片局部区域像素值处理详解
2019/01/23 Python
Pandas 缺失数据处理的实现
2019/11/04 Python
pycharm新建Vue项目的方法步骤(图文)
2020/03/04 Python
Python捕获异常堆栈信息的几种方法(小结)
2020/05/18 Python
Keras之fit_generator与train_on_batch用法
2020/06/17 Python
Python将list元素转存为CSV文件的实现
2020/11/16 Python
python 检测图片是否有马赛克
2020/12/01 Python
HTML5 Canvas绘制文本及图片的基础教程
2016/03/14 HTML / CSS
基于 HTML5 WebGL 实现的垃圾分类系统
2019/10/08 HTML / CSS
英国在线购买轮胎、预订汽车、汽车维修和装配网站:Protyre
2020/04/12 全球购物
高中数学教师求职信
2013/10/30 职场文书
煤矿开采专业求职信
2014/07/08 职场文书
争先创优公开承诺书
2014/08/30 职场文书
终止解除劳动合同证明书
2015/06/17 职场文书
毕业典礼致辞
2015/07/29 职场文书
Mysql systemctl start mysqld报错的问题解决
2021/06/03 MySQL
用Python爬取某乎手机APP数据
2021/06/15 Python
「Manga Time Kirara MAX」2022年5月号封面公开
2022/03/21 日漫