前端可以用js获取textarea中当前光标位置的行数吗?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端可以用js获取textarea中当前光标位置的行数吗?相关的知识,希望对你有一定的参考价值。

var nu = Math.floor((event.offsetY+textarea.scrollTop)/20)+1;//光标所在行数
这个可以获取到行数。。。但是只能在点击事件里面生效 有什么办法我要让回车事件里面也能获取到光标所在的行数。是在一个textarea标签中。

获取不了,你的textare的行数,和你的textarea的样式有很大的关系,已经你的textarea在不同的浏览器会出现可以拉伸和缩短的现象。追问

这跟样式有什么关系??我想要的结果就是获取到光标位置的行数,
Math.floor((event.offsetY+textarea.scrollTop)/20)+1;这个获取到的行数就不会被样式影响啊。不管它变形成什么样只要取文本域中光标的位置就行了。

参考技术A 如果你这样:var nu = Math.floor((event.offsetY+textarea.scrollTop)/20)+1;可以获取到,那回车也肯定可以获取到,你搜索一下“回车事件”,js有,回车键就执行的事件的,然后把这个放到回车事件里面就可以了追问

回车事件没用 这个点击事件里面能取到。
我放代码出来吧
textarea.onclick=function(event)
nu = Math.floor((event.offsetY+textarea.scrollTop)/20)+1;//光标所在行数
;//这里可以取到
//回车触发事件
$("#newpartstexta").keydown(function()

if(event.keyCode == 13)
//这里写你要执行的事件;
nu = Math.floor((event.offsetY+textarea.scrollTop)/20)+1;//放到这里就取不到

);

参考技术B 你可以在keydown事件里判断e.keyCode = 66(回车键)的时候 再去获取行数追问

你知道怎么获取行数的办法吗 ? 我上面那串代码貌似不行。

追答$("#newpartstexta").keydown(function(event)

if(event.keyCode == 13)
//这里写你要执行的事件;
nu = Math.floor((event.offsetY+textarea.scrollTop)/20)+1;//放到这里就取不到

);
你的取不到,是因为function参数没写event吧

参考技术C 夏侯惇 边江

获取textarea文本框所选字符光标位置索引,以及选中的文本值;textarea高度自适应,随着内容增加高度增加;获取输入框中的光标位置

获取textarea文本框所选字符光标位置索引,以及选中的文本值

         $.fn.selection = function () {
                    var s, e, range, stored_range;
                    if (this[0].selectionStart == undefined) {
                        var selection = document.selection;
                        if (this[0].tagName.toLowerCase() != "textarea") {
                            var val = this.val();
                            range = selection.createRange().duplicate();
                            range.moveEnd("character", val.length);
                            s = (range.text == "" ? val.length : val.lastIndexOf(range.text));
                            range = selection.createRange().duplicate();
                            range.moveStart("character", -val.length);
                            e = range.text.length;
                        } else {
                            range = selection.createRange(),
                                stored_range = range.duplicate();
                            stored_range.moveToElementText(this[0]);
                            stored_range.setEndPoint(‘EndToEnd‘, range);
                            s = stored_range.text.length - range.text.length;
                            e = s + range.text.length;
                        }
                    } else {
                        s = this[0].selectionStart,
                            e = this[0].selectionEnd;
                    }
                    var te = this[0].value.substring(s, e);
                    return {start: s, end: e, text: te};
                };

textarea高度自适应,随着内容增加高度增加

                $.fn.autoHeight = function(){
                    return this.each(function(){
                        var $this = jQuery(this);
                        if( !$this.attr(‘_initAdjustHeight‘) ){
                            $this.attr(‘_initAdjustHeight‘, $this.outerHeight());
                        }
                        _adjustH(this).on(‘input‘, function(){
                            _adjustH(this);
                        });
                    });
                    /**
                     * 重置高度
                     * @param {Object} elem
                     */
                    function _adjustH(elem){
                        var $obj = jQuery(elem);
                        return $obj.css({height: $obj.attr(‘_initAdjustHeight‘), ‘overflow-y‘: ‘hidden‘})
                            .height( elem.scrollHeight );
                    }

                };

获取输入框中的光标位置

                $.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;
                };

 

以上是关于前端可以用js获取textarea中当前光标位置的行数吗?的主要内容,如果未能解决你的问题,请参考以下文章

js 获取 textarea 光标所在行的开头有多少空格

请教JS大神,如何在一个可编辑的DIV里,获取当前光标的位置,需要兼容IE9+

js在opera下怎样获取可编辑div中的鼠标光标和选中文本

c# 动态获取当前屏幕中光标所在位置

如何利用JS代码选取textarea中的指定行

如何从 GWT 中的 RichTextArea 获取光标位置或位置?