基于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几个不错的函数 $$()
Oct 09 Javascript
ajaxControlToolkit AutoCompleteExtender的用法
Oct 30 Javascript
图片轮换效果实现代码(点击按钮停止执行)
Apr 12 Javascript
js图片自动轮播代码分享(js图片轮播)
May 06 Javascript
在Google 地图上实现做的标记相连接
Jan 05 Javascript
JavaScript操作 url 中 search 部分方法函数
Jun 15 Javascript
打造自己的jQuery插件入门教程
Sep 23 Javascript
jquery  实现轮播图详解及实例代码
Oct 12 Javascript
vue简单练习 桌面时钟的实现代码实例
Sep 19 Javascript
layui点击弹框页面 表单请求的方法
Sep 21 Javascript
JS实现无限轮播无倒退效果
Sep 21 Javascript
vue项目如何监听localStorage或sessionStorage的变化
Jan 04 Vue.js
基于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
PHP 存储文本换行实现方法
2010/01/05 PHP
初识php MVC
2014/09/10 PHP
php+ajax简单实现全选删除的方法
2016/12/06 PHP
Javascript 继承实现例子
2009/08/12 Javascript
JavaScript异步回调的Promise模式封装实例
2014/06/07 Javascript
JavaScript严格模式禁用With语句的原因
2014/10/20 Javascript
jQuery中closest()函数用法实例
2015/01/07 Javascript
javascript实现验证身份证号的有效性并提示
2015/04/30 Javascript
JavaScript实现简单的数字倒计时
2015/05/15 Javascript
实现JavaScript高性能的数据存储
2016/12/11 Javascript
原生JS和jQuery操作DOM对比总结
2017/01/19 Javascript
vue axios用法教程详解
2017/07/23 Javascript
VueRouter导航守卫用法详解
2017/12/25 Javascript
vue组件中的样式属性scoped实例详解
2018/10/30 Javascript
vue实现自定义H5视频播放器的方法步骤
2019/07/01 Javascript
跟老齐学Python之深入变量和引用对象
2014/09/24 Python
python一键升级所有pip package的方法
2017/01/16 Python
Python文本特征抽取与向量化算法学习
2017/12/22 Python
使用Python的Django和layim实现即时通讯的方法
2018/05/25 Python
浅析Python 3 字符串中的 STR 和 Bytes 有什么区别
2018/10/14 Python
python提取包含关键字的整行数据方法
2018/12/11 Python
python可视化实现代码
2019/01/15 Python
python 实现将文件或文件夹用相对路径打包为 tar.gz 文件的方法
2019/06/10 Python
如何在Django项目中引入静态文件
2019/07/26 Python
使用keras实现BiLSTM+CNN+CRF文字标记NER
2020/06/29 Python
python tqdm实现进度条的示例代码
2020/11/10 Python
Python模拟登录requests.Session应用详解
2020/11/17 Python
Python制作运行进度条的实现效果(代码运行不无聊)
2021/02/24 Python
Dockers美国官方网站:卡其裤、男士服装、鞋及配件
2016/11/22 全球购物
菲律宾领先的在线时尚商店:Zalora菲律宾
2018/02/08 全球购物
澳大利亚购买最佳炊具品牌网站:Cookware Brands
2019/02/16 全球购物
学校感恩教育活动总结
2014/07/07 职场文书
2014收银员工作总结范文
2014/12/16 职场文书
补充协议书
2015/01/28 职场文书
学校运动会通讯稿
2015/07/18 职场文书
python实现简易名片管理系统
2021/04/11 Python