创建聊天窗口时，滚动条不会下降

Question

我目前正在开发一个聊天应用程序，它将同时支持最多四个窗口。

当我打开一个新的聊天窗口时，即使调用了该函数，滚动条也不会下降。每当我发送邮件时，它都能正常工作。

function createChat(caller_id) {
      $.ajax({
        type: 'POST',
        url: 'create_chat_interface.php',
        data: {
          caller_id: caller_id,
        },
        success: function(data) {
          if (!$('#chat-history-' + caller_id).length) {
            if ($.trim($("#chat1").html()) == '') {
              $('#chat1').html(data);
              document.getElementById("chat-close").id = 'chat-close1';
            } else if ($.trim($("#chat2").html()) == '') {
              $('#chat2').html(data);
              document.getElementById("chat-close").id = 'chat-close2';
            } else if ($.trim($("#chat3").html()) == '') {
              $('#chat3').html(data);
              document.getElementById("chat-close").id = 'chat-close3';
            } else if ($.trim($("#chat4").html()) == '') {
              $('#chat4').html(data);
              document.getElementById("chat-close").id = 'chat-close4';
            }
            $('#chat-input-' + caller_id).focus();
            scrollDown(caller_id);
          }
        }
      })
    }

function fetch_chat_history($caller_id, $db)
{
  $query = "SELECT * FROM messages WHERE from_id = '$caller_id'
  OR to_id = '$caller_id' ORDER BY timestamp ASC";
  $result = mysqli_query($db, $query);
  $row = mysqli_fetch_assoc($result);

  $output = '<ul>';

  foreach ($result as $row) {
    if ($row['from_id'] == $caller_id) {
      $output .= '
      <li class="received"><p>' . $row['message'] . '</p></li>';
    } else {
      $output .= '
      <li class="sent"><p>' . $row['message'] . '</p></li>';
    }
  }

  $output .= '</ul>';

  return $output;
}