jQuery实现在textarea指定位置插入字符或表情的方法


Posted in Javascript onMarch 11, 2015

本文实例讲述了jQuery实现在textarea指定位置插入字符或表情的方法。分享给大家供大家参考。具体实现方法如下:

1. 函数定义    

(function($){

    $.fn.extend({

        insertAtCaret: function(myValue){

            var $t=$(this)[0];

            if (document.selection) {

                this.focus();

                sel = document.selection.createRange();

                sel.text = myValue;

                this.focus();

            }

            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;

                }

                else {

                    this.value += myValue;

                    this.focus();

                }

        }

    })  

})(jQuery);

2. 调用方法
$("#textareaId").insertAtCaret("新表情");

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
js获取IFRAME当前的URL的方法
Nov 13 Javascript
把文本中的URL地址转换为可点击链接的JavaScript、PHP自定义函数
Jul 29 Javascript
浅谈setTimeout 与 setInterval
Jun 23 Javascript
JavaScript中的Function函数
Aug 27 Javascript
js实现prototype扩展的方法(字符串,日期,数组扩展)
Jan 14 Javascript
JavaScript仿微博发布信息案例
Nov 16 Javascript
JS操作input标签属性checkbox全选的实现代码
Mar 02 Javascript
利用Vue v-model实现一个自定义的表单组件
Apr 27 Javascript
详解在vue-cli中引用jQuery、bootstrap以及使用sass、less编写css
Nov 08 jQuery
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 Javascript
浅入深出Vue之组件使用
Jul 11 Javascript
如何通过Proxy实现JSBridge模块化封装
Oct 22 Javascript
jQuery实现统计输入文字个数的方法
Mar 11 #Javascript
jQuery处理json数据返回数组和输出的方法
Mar 11 #Javascript
jquery实现表格本地排序的方法
Mar 11 #Javascript
jQuery实现渐变下拉菜单的简单方法
Mar 11 #Javascript
jQuery实现新消息闪烁标题提示的方法
Mar 11 #Javascript
javascript实现详细时间提醒信息效果的方法
Mar 11 #Javascript
JavaScript实现SHA-1加密算法的方法
Mar 11 #Javascript
You might like
php 遍历显示文件夹下所有目录、所有文件的函数,没有分页的代码
2008/11/14 PHP
如何正确配置Nginx + PHP
2016/07/15 PHP
php 根据自增id创建唯一编号类
2017/04/06 PHP
php curl上传、下载、https登陆实现代码
2017/07/23 PHP
借用Google的Javascript API Loader来加速你的网站
2009/01/28 Javascript
js 格式化时间日期函数小结
2010/03/20 Javascript
js 模拟气泡屏保效果代码
2010/07/10 Javascript
jQuery当鼠标悬停时放大图片的效果实例
2013/07/03 Javascript
Node.js的Mongodb使用实例
2016/12/30 Javascript
微信小程序中多个页面传参通信的学习与实践
2017/05/05 Javascript
vue中七牛插件使用的实例代码
2017/07/28 Javascript
react native基于FlatList下拉刷新上拉加载实现代码示例
2018/09/30 Javascript
[原创]微信小程序获取网络类型的方法示例
2019/03/01 Javascript
简单了解three.js 着色器材质
2020/08/03 Javascript
VUE中V-IF条件判断改变元素的样式操作
2020/08/09 Javascript
[03:46]DOTA2英雄基础教程 维萨吉
2013/12/11 DOTA
[52:32]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第三场 11.18
2020/11/18 DOTA
python 美化输出信息的实例
2018/10/15 Python
Python Pandas实现数据分组求平均值并填充nan的示例
2019/07/04 Python
解决Pycharm的项目目录突然消失的问题
2020/01/20 Python
python TCP包注入方式
2020/05/05 Python
细说CSS3中box属性中的overflow-x属性和overflow-y属性值的效果
2014/07/21 HTML / CSS
CSS3 旋转立方体问题详解
2020/01/09 HTML / CSS
HTML5 Canvas实现放大镜效果示例
2020/03/25 HTML / CSS
2013年办公室秘书的个人自我鉴定
2013/10/24 职场文书
教师应聘个人求职信
2013/12/10 职场文书
小区门卫值班制度
2014/01/24 职场文书
四年级科学教学反思
2014/02/10 职场文书
五分钟演讲稿
2014/04/30 职场文书
单位租车协议书
2015/01/29 职场文书
食品安全责任书范本
2015/05/09 职场文书
微信早安问候语
2015/11/10 职场文书
七年级语文教学反思
2016/03/03 职场文书
pytorch中的model=model.to(device)使用说明
2021/05/24 Python
MySQL Server 层四个日志
2022/03/31 MySQL
关于pytest结合csv模块实现csv格式的数据驱动问题
2022/05/30 Python