控制textarea滚动技巧

最新推荐文章于 2024-07-15 03:00:38 发布

robinhf

最新推荐文章于 2024-07-15 03:00:38 发布

阅读量1.1k

点赞数

分类专栏： web JavaScript 文章标签： button input scroll function html ie

本文链接：https://blog.csdn.net/robinhf/article/details/1507731

版权

JavaScript 同时被 2 个专栏收录

20 篇文章 0 订阅

订阅专栏

web

7 篇文章 0 订阅

订阅专栏

<HTML>
<HEAD>
<TITLE>
TextArea scrolling in IE4+
</TITLE>
<SCRIPT>
function scrollToTop (element) {
if (document.all)
    element.scrollTop = 0;
}
function scrollToBottom (element) {
if (document.all)
    element.scrollTop = element.scrollHeight;
}
function setCaretToStart (input) {
if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.select();
}
}
function setCaretToEnd (input) {
if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(false);
    range.select();
}
}
</SCRIPT>
<SCRIPT>
var i = 3;
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE="button" VALUE="addLine and scroll to bottom"
       ONCLICK="document.all.aTextArea.value += '/n' + i++ + ':
Kibology';
                scrollToBottom(document.all.aTextArea);"
>
<INPUT TYPE="button" VALUE="addLine and set caret to end"
       ONCLICK="document.all.aTextArea.value += '/n' + i++ + ':
Kibology';
                setCaretToEnd(document.all.aTextArea);"
>
<BR>
<INPUT TYPE="button" VALUE="scroll to top"
       ONCLICK="scrollToTop(document.all.aTextArea);"
>
<INPUT TYPE="button" VALUE="scroll to bottom"
       ONCLICK="scrollToBottom(document.all.aTextArea);"
>
<BR>
<INPUT TYPE="button" VALUE="set caret to start"
       ONCLICK="setCaretToStart(document.all.aTextArea);"
>
<INPUT TYPE="button" VALUE="set caret to end"
       ONCLICK="setCaretToEnd(document.all.aTextArea);"
>
<BR>
<TEXTAREA ID="aTextArea" ROWS="3" COLS="20" WRAP="soft">
1: Kibology
2: Kibology</TEXTAREA>
</BODY>
</HTML>