基于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 相关文章推荐
javascript getElementsByClassName 和js取地址栏参数
Jan 02 Javascript
用javascript删除当前行,添加行(示例代码)
Nov 25 Javascript
浮动的div自适应居中显示的js代码
Dec 23 Javascript
JQuery菜单效果的两个实例讲解(3)
Sep 17 Javascript
jQuery实现的瀑布流加载效果示例
Sep 13 Javascript
js模态对话框使用方法详解
Feb 16 Javascript
原生JS实现日历组件的示例代码
Sep 22 Javascript
angularjs中判断ng-repeat是否迭代完的实例
Sep 12 Javascript
Vue自定义指令上报Google Analytics事件统计的方法
Feb 25 Javascript
微信小程序分享功能onShareAppMessage(options)用法分析
Apr 24 Javascript
运用js实现图层拖拽的功能
May 24 Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
Jul 10 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
长波知识介绍
2021/03/01 无线电
工厂模式在Zend Framework中应用介绍
2012/07/10 PHP
phpMyAdmin自动登录和取消自动登录的配置方法
2014/05/12 PHP
Yii 2.0如何使用页面缓存方法示例
2017/05/23 PHP
浅谈PHP接入(第三方登录)QQ登录 OAuth2.0 过程中遇到的坑
2017/10/13 PHP
php反射学习之依赖注入示例
2019/06/14 PHP
PHP进阶学习之反射基本概念与用法分析
2019/06/18 PHP
在线游戏大家来找茬II
2006/09/30 Javascript
Bootstrap表单Form全面解析
2016/06/13 Javascript
Highcharts入门之基本属性
2016/08/02 Javascript
AngularJS指令与控制器之间的交互功能示例
2016/12/14 Javascript
Node.js制作简单聊天室
2017/01/12 Javascript
JS设置随机出现2个数字的实例代码
2017/07/19 Javascript
基于JS实现移动端左滑删除功能
2017/07/28 Javascript
jQuery 实时保存页面动态添加的数据的示例
2017/08/14 jQuery
JS中的回调函数实例浅析
2018/03/21 Javascript
关于jquery layui弹出层的使用方法
2018/04/21 jQuery
详解从Vue-router到html5的pushState
2018/07/21 Javascript
JavaScript类的继承操作实例总结
2018/12/20 Javascript
Vue动态修改网页标题的方法及遇到问题
2019/06/09 Javascript
小谈angular ng deploy的实现
2020/04/07 Javascript
[01:17:55]VGJ.T vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/20 DOTA
Python urlopen 使用小示例
2008/09/06 Python
Python的Flask框架中配置多个子域名的方法讲解
2016/06/07 Python
python3操作mysql数据库的方法
2017/06/23 Python
tensorflow学习笔记之简单的神经网络训练和测试
2018/04/15 Python
pandas 实现将重复表格去重,并重新转换为表格的方法
2018/04/18 Python
基于Python在MacOS上安装robotframework-ride
2018/12/28 Python
NBA欧洲商店(英国):NBA Europe Store UK
2018/07/27 全球购物
数控技术与应用毕业生自荐信
2013/09/24 职场文书
大学生个人事迹材料
2014/01/21 职场文书
品牌推广策划方案
2014/05/28 职场文书
学校宣传标语
2014/06/18 职场文书
2015年双拥工作总结
2015/04/08 职场文书
2015小学教师年度工作总结
2015/05/12 职场文书
不同意离婚代理词
2015/05/23 职场文书