快捷導(dǎo)航

jQuery實現(xiàn)在textarea指定位置插入字符或表情的方法

更新時間：2015年03月11日 14:50:25 作者：黃平俊

這篇文章主要介紹了jQuery實現(xiàn)在textarea指定位置插入字符或表情的方法,實例分析了jQuery操作表單元素的技巧,非常實用,具有一定參考借鑒價值,需要的朋友可以參考下

本文實例講述了jQuery實現(xiàn)在textarea指定位置插入字符或表情的方法。分享給大家供大家參考。具體實現(xiàn)方法如下：

1. 函數(shù)定義

(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. 調(diào)用方法

復(fù)制代碼代碼如下:

$("#textareaId").insertAtCaret("新表情");

希望本文所述對大家的jQuery程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

jQuery團(tuán)購倒計時特效實現(xiàn)方法
這篇文章主要介紹了jQuery團(tuán)購倒計時特效實現(xiàn)方法,可實現(xiàn)相對固定時間的倒計時效果,非常具有實用價值,需要的朋友可以參考下
2015-05-05
jQuery瀑布流插件Wookmark使用實例
Wookmark jQuery插件大致使用position:absolute來重構(gòu)內(nèi)容實現(xiàn)瀑布流布局,需要的朋友可以參考下
2014-04-04
jquery遍歷select元素(實例講解)
本篇文章主要是對jquery遍歷select元素的實例進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
Bootstrap+Jquery實現(xiàn)日歷效果
這篇文章主要為大家詳細(xì)介紹了Bootstrap+Jquery實現(xiàn)日歷效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-08-08
提示$ is not defined錯誤分析及解決
$ is not defined這種提示想必在調(diào)試時經(jīng)常會遇到吧，經(jīng)過搜索查詢了一下結(jié)果是引入Jquery的順序不對，改過來就可以了，有此問題的朋友可以參考下哈
2013-04-04
jquery插件開發(fā)之實現(xiàn)md5插件
這篇文章主要介紹了jquery開發(fā)實現(xiàn)的md5插件，最后返回的是一串十進(jìn)制數(shù)，在jquery1.9.2下測試通過,需要的朋友可以參考下
2014-03-03
jQuery中append、insertBefore、after與insertAfter的簡單用法與注意事項
這篇文章主要為大家介紹了jQuery中append、appendTo、prepend、prependTo、before、insertBefore、after與insertAfter方法注意事項,需要的朋友可以參考下
2010-12-12
jquery post方式傳遞多個參數(shù)值后臺以數(shù)組的方式進(jìn)行接收
在用jquery的post方式傳遞多個值時，在后臺頁面可以用數(shù)組形式接收,很不錯吧，可以接收多個值啊，接下來介紹實現(xiàn)方法，感興趣的朋友可以了解下哦
2013-01-01
學(xué)習(xí)jquery必備 api中英文對照的chm手冊下載
學(xué)習(xí)jquery必備 api中英文對照的chm手冊下載...
2007-05-05
Jqgrid表格隨窗口大小改變而改變的簡單實例
本篇文章主要是對Jqgrid表格隨窗口大小改變而改變的簡單實例進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12