javascript - 开始滚动到 div 标签的底部

Question

我知道它简单易行，但就我而言，我不知道为什么它不起作用， 我有带滚动条的 div，我希望它从底部开始。我在这里阅读了一些问题并在谷歌中搜索，但它不适用于我的程序。这是我的 jquery 代码，它从底部开始，但是当我滚动时它总是回到底部。所以我删除了设置的间隔，我只调用函数 updateScroll();但是滚动再次从顶部开始，伙计们帮助我

<script type="text/javascript">

  function updateScroll(){
  var element = document.getElementById("msgss");
  element.scrollTop = element.scrollHeight;
 }
 setInterval(updateScroll,1000);

</script>

这是我的div标签

<div class="col-md-6 convo">
  <chat-log :messages="messages" id="msgss"></chat-log>
  <div class="row">
    <div class="col-md-12 chat-composer">
      <textarea class="compose" type="text" name="" placeholder="Type your Message" v-model="messageText" @keydown="vmsg"></textarea>
      <button type="button" name="button" class="btn btn-primary send" @click="sendMessage">Send</button>
    </div>
  </div>
</div>

这是 <chat-log :messages="messages" id="msgss"></chat-log> 的内容

<template lang="html">
  <div class="chat-log">
      <chat-message v-for="message in messages" v-bind:key="messages.text" :message="message"></chat-message>
      <div class="empty" v-show="messages.length === 0">
          Nothing here yet!
      </div>
  </div>
</template>

和CSS

#msgss{
  overflow-y: auto;
  height: 540px;
}

Answer 1

Please try this

 window.setInterval(function() {
      var element = document.getElementById('msgss');
      element.scrollTop = element.scrollHeight;
    }, 1000);