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 相关文章推荐
IE autocomplete internet explorer's autocomplete
Jun 30 Javascript
IE无法设置短域名下Cookie
Sep 23 Javascript
jquery实现简洁文件上传表单样式
Nov 02 Javascript
解读Bootstrap v4 sass设计
May 29 Javascript
微信小程序 本地存储及登录页面处理实例详解
Jan 11 Javascript
JavaScript数据结构之二叉树的查找算法示例
Apr 13 Javascript
JS实现常见的查找、排序、去重算法示例
May 21 Javascript
详解微信小程序调起键盘性能优化
Jul 24 Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
Mar 29 Javascript
vue实现直播间点赞飘心效果的示例代码
Sep 20 Javascript
vue中后端做Excel导出功能返回数据流前端的处理操作
Sep 08 Javascript
详解微信小程序轨迹回放实现及遇到的坑
Feb 02 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
第九节--绑定
2006/11/16 PHP
Zend的AutoLoad机制介绍
2012/09/27 PHP
基于PHP常用字符串的总结(待续)
2013/06/07 PHP
php使用curl简单抓取远程url的方法
2015/03/13 PHP
PHP表单数据写入MySQL数据库的代码
2016/05/31 PHP
Yii2实现log输出到file及database的方法
2016/11/12 PHP
Thinkphp 框架扩展之行为扩展原理与实现方法分析
2020/04/23 PHP
JavaScript中两种链式调用实现代码
2011/01/12 Javascript
Javascript setInterval的两种调用方法(实例讲解)
2013/11/29 Javascript
Javascript单元测试框架QUnitjs详细介绍
2014/05/08 Javascript
轻松学习jQuery插件EasyUI EasyUI实现树形网络基本操作(2)
2015/11/30 Javascript
js removeChild 方法深入理解
2016/08/16 Javascript
什么是Vue.js框架 为什么选择它?
2017/10/17 Javascript
vue router仿天猫底部导航栏功能
2017/10/18 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
2018/07/07 Javascript
React Native开发封装Toast与加载Loading组件示例
2018/09/08 Javascript
vue 使用 sortable 实现 el-table 拖拽排序功能
2020/12/26 Vue.js
[01:15]《辉夜杯》北京网鱼队巡礼
2015/10/26 DOTA
python实现定时播放mp3
2015/03/29 Python
python OpenCV学习笔记实现二维直方图
2018/02/08 Python
python 使用re.search()筛选后 选取部分结果的方法
2018/11/28 Python
django的model操作汇整详解
2019/07/26 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
Django基于客户端下载文件实现方法
2020/04/21 Python
Python新手如何理解循环加载模块
2020/05/29 Python
家长会学生家长演讲稿
2013/12/29 职场文书
《七颗钻石》教学反思
2014/02/28 职场文书
高中军训感言1000字
2014/03/01 职场文书
节能减排倡议书
2014/04/15 职场文书
保证书范文大全
2014/04/28 职场文书
大学竞选班干部演讲稿
2014/08/21 职场文书
医院党员公开承诺书
2014/08/30 职场文书
2014年检验员工作总结
2014/11/19 职场文书
2015年父亲节寄语
2015/03/23 职场文书
入队仪式主持词
2015/07/04 职场文书
不同品牌、不同型号对讲机如何互相通联
2022/02/18 无线电