您好,UncleToo欢迎您!  为了更好的浏览本站,请使用高版本浏览器
RSS  Tag     设为首页 | 加入收藏
 您所在的位置:首页 > 前端开发 > Javascript(JQuery)

用JQuery获取textarea或input中的光标位置

作者:UncleToo  来源:原创  日期:2013-12-25 8:03:47
收藏  评论:( 4 )  阅读:4455

前端开发中经常会遇到获取光标的位置,网络上也有很多关于获取光标位置的方法,但是UncleToo发现这些方法都是用过JS操作DOM实现的,代码量大,本文将给大家分享一个用JQuery的方法获取textarea或input文本框中光标的位置,方法简单,代码量也比较少。使用之前要记得引用JQuery类库文件。

JS代码:

(function($, undefined) {
    $.fn.getCursorPosition = function() {
        var el = $(this).get(0);
        var pos = 0;
        if ('selectionStart' in el) {
            pos = el.selectionStart;
        } else if ('selection' in document) {
            el.focus();
            var Sel = document.selection.createRange();
            var SelLength = document.selection.createRange().text.length;
            Sel.moveStart('character', -el.value.length);
            pos = Sel.text.length - SelLength;
        }
        return pos;
    }
})(jQuery);

使用方法:

<textarea id="the_id_value">the text is an example</textarea>
                                                   
<a href="#" onclick="alert( $('#the_id_value').getCursorPosition() );
    return false;">点击我</a>

然后我们把光标放在下图位置:

点击“点击我”即可弹出光标所在的位置:


本文由UncleToo原创,转载请注明出处!




除非特别声明,本站所有PHP教程及其他教程/文章均为原创、翻译或网友投稿,版权均归UncleToo中文网所有, 转载请注明作者及出处。
原文网址:http://www.uncletoo.com/html/jsjquery/755.html
读完这篇文章后,你是否有所收获? 分享是一种生活的信念!
  • 0
  • 0
我来说两句
更多>>网友评论