基于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 相关文章推荐
window.open()弹出居中的窗口
Feb 01 Javascript
学习YUI.Ext 第七天--关于View&amp;JSONView
Mar 10 Javascript
js资料toString 方法
Mar 13 Javascript
jQuery实现动画效果的简单实例
Jan 27 Javascript
js父页面与子页面不同时显示的方法
Oct 16 Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
Sep 19 Javascript
基于Layer+jQuery的自定义弹框
May 26 Javascript
微信页面倒计时代码(解决safari不兼容date的问题)
Dec 13 Javascript
详解MVC如何使用开源分页插件(shenniu.pager.js)
Dec 16 Javascript
浅谈js停止事件冒泡 阻止浏览器的默认行为(阻止超连接 #)
Feb 08 Javascript
一个Js文件函数中调用另一个Js文件函数的方法演示
Aug 14 Javascript
vue实现的上拉加载更多数据/分页功能示例
May 25 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
php和js交互一例-PHP教程,PHP应用
2007/01/03 PHP
php 中文和编码判断代码
2010/05/16 PHP
PHP 基于Yii框架中使用smarty模板的方法详解
2013/06/13 PHP
简单理解PHP的面向对象编程方式
2016/05/17 PHP
php实现URL加密解密的方法
2016/11/17 PHP
php in_array() 检查数组中是否存在某个值详解
2016/11/23 PHP
php过滤输入操作之htmlentities与htmlspecialchars用法分析
2017/02/17 PHP
jquery 图片上传按比例预览插件集合
2011/05/28 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
2014/04/04 Javascript
jQuery替换textarea中换行的方法
2015/06/10 Javascript
jquery实现图片上传前本地预览功能
2016/05/10 Javascript
纯js实现动态时间显示
2020/09/07 Javascript
Webpack打包字体font-awesome的方法示例
2018/04/26 Javascript
layerUI下的绑定事件实例代码
2018/08/17 Javascript
在vue中嵌入外部网站的实现
2020/11/13 Javascript
[01:06:12]VP vs NIP 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
利用QT写一个极简单的图形化Python闹钟程序
2015/04/07 Python
Python使用gensim计算文档相似性
2016/04/10 Python
对python读写文件去重、RE、set的使用详解
2018/12/11 Python
python实现字符串加密 生成唯一固定长度字符串
2019/03/22 Python
Django使用redis缓存服务器的实现代码示例
2019/04/28 Python
如何安装并使用conda指令管理python环境
2019/07/10 Python
django的auth认证,authenticate和装饰器功能详解
2019/07/25 Python
Python之Numpy的超实用基础详细教程
2019/10/23 Python
Django框架下静态模板的继承操作示例
2019/11/08 Python
python Jupyter运行时间实例过程解析
2019/12/13 Python
Pytorch 实现focal_loss 多类别和二分类示例
2020/01/14 Python
Python decorator拦截器代码实例解析
2020/04/04 Python
简单聊聊H5的pushState与replaceState的用法
2018/04/03 HTML / CSS
机械设计职业生涯规划书
2013/12/27 职场文书
九一八事变演讲稿
2014/09/05 职场文书
2014年酒店前台工作总结
2014/11/14 职场文书
广告文案的撰写技巧(实用干货)
2019/08/23 职场文书
Python爬虫进阶之Beautiful Soup库详解
2021/04/29 Python
使用springboot暴露oracle数据接口的问题
2021/05/07 Oracle
Python机器学习之基于Pytorch实现猫狗分类
2021/06/08 Python