将输入框滚动到javascript中的光标位置 [英] Scroll an input box to the cursor position in javascript

查看:147
本文介绍了将输入框滚动到javascript中的光标位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我写了一个简单的JS函数,当它接收到焦点时,将光标置于输入框内容的末尾(框中最常见的动作是追加)。我没有在IE中检查,但是当有更多的文本比可见,甚至将光标移动到输入的结尾不会滚动视图到firefox 3.6输入的结束。



任何想法如何做到这一点?



PS不,我没有使用JQuery,也不是一个选项;)

找到解决方案这里使用不同的措辞(光标而不是光标) 您可以通过分配给textarea的scrollTop属性来滚动: / p>

  //滚动到底部
elt.scrollTop = elt.scrollHeight; Firefox和Safari也提供了

/DOM/window.scrollByLinesrel =nofollow noreferrer> scrollByLines ,IE有 doScroll ,但是scrollTop属性是跨浏览器的并且更简单。



就我个人而言,当光标移动到textarea的末尾时,我不喜欢它。如果我最后想要的话,那么我自己就需要一秒钟的时间。将光标从末尾移动到中间的某个位置需要一秒左右的时间(末尾是一个更大的目标,因此需要更少的时间来打)。除非textarea具有特殊用途,否则我不打扰与追加在焦点功能。


I've written a simple JS function that places the cursor at the end of the contents of an input box when it receives focus (the most common action in the box being to append). I haven't checked in IE, but when there is more text than is visible, even moving the cursor to the end of input doesn't scroll the view to the end of input in firefox 3.6.

Any idea how to do this?

P.S. And no I'm not using JQuery, nor is it an option ;)

Found a solution here using different wording (caret instead of cursor)

解决方案

You can scroll by assigning to the textarea's scrollTop property:

// scroll to bottom
elt.scrollTop = elt.scrollHeight;

Firefox and Safari also offer scrollByLines, and IE has doScroll, but the scrollTop property is cross-browser and simpler to use.

Personally, I don't like it when the cursor is moved for me to the end of a textarea. If I want it at the end, it takes a fraction of a second to do it my self. It takes around a second to move the cursor from the end to somewhere in the middle (the end is a larger target, thus takes less time to hit). Unless the textarea has a special purpose, I wouldn't bother with the append-on-focus function.

这篇关于将输入框滚动到javascript中的光标位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆