slippersheepig/chatgpt-html

连续对话时,滚动条不会自动下拉

401142415 opened this issue · 4 comments

连续对话时,滚动条不会自动下拉

是有这个问题,我尝试过调整但搞不定,希望有大佬可以PR

是有这个问题,我尝试过调整但搞不定,希望有大佬可以 PR

忘了自己改过啥了,但我目前是下面这样的。可以下拉了,你试试看吧

    <div class="chat_window">
        <ul class="messages">
            <div style="text-align: left; color: black" id="chat" class="content">
                <pre style="white-space: pre-wrap; word-wrap:break-word" id="chat-log"></pre>
            </div>
        </ul>
        <div class="bottom_wrapper clearfix">
            <textarea class="message_input_wrapper markdown" placeholder=" 输入help获取帮助信息."
                      id="chat-message-input"></textarea>
            <button class="send_message" id="chat-message-submit" value="Send"> 提交</button>
        </div>
    </div>
      chatSocket.onmessage = function (e) {
            var data = JSON.parse(e.data);
            var message = data['message'];
            var chatlog = document.getElementById("chat-log");
            var response = document.createElement("div");
            response.innerHTML = marked.marked(message);
            response.className = "markdown";
            chatlog.appendChild(response);
            $(".messages").scrollTop($(".messages")[0].scrollHeight);


        };

是有这个问题,我尝试过调整但搞不定,希望有大佬可以 PR

忘了自己改过啥了,但我目前是下面这样的。可以下拉了,你试试看吧

    <div class="chat_window">
        <ul class="messages">
            <div style="text-align: left; color: black" id="chat" class="content">
                <pre style="white-space: pre-wrap; word-wrap:break-word" id="chat-log"></pre>
            </div>
        </ul>
        <div class="bottom_wrapper clearfix">
            <textarea class="message_input_wrapper markdown" placeholder=" 输入help获取帮助信息."
                      id="chat-message-input"></textarea>
            <button class="send_message" id="chat-message-submit" value="Send"> 提交</button>
        </div>
    </div>
      chatSocket.onmessage = function (e) {
            var data = JSON.parse(e.data);
            var message = data['message'];
            var chatlog = document.getElementById("chat-log");
            var response = document.createElement("div");
            response.innerHTML = marked.marked(message);
            response.className = "markdown";
            chatlog.appendChild(response);
            $(".messages").scrollTop($(".messages")[0].scrollHeight);


        };

还引入了一堆,有个报错是要引入下面中的一个的,忘了哪个

<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_HTML"></script>
<script src="https://cdn.staticfile.org/clipboard.js/2.0.4/clipboard.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/a11y-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/highlight.min.js"></script>
<!-- and it's easy to individually load additional languages -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/languages/go.min.js"></script>

fixed