自动滚动不起作用 [英] auto scroll not working

问题描述

我使用jquery的自动滚动不起作用，这是我的CSS中的内容:

My auto scroll with jquery does not work, here what's in my css:

#convo_mes{
    text-align:left;
    width:98%;
    height:80%;
    background:#fff;
    border:1px solid #000;
    overflow-x:auto;
}

在我的js中:

$(".mes").click(function(){
    var user = $(this).attr("id");
    $("#convo").html("<b>"+user+"</b>");
    $("#convo_ctrl").show();
    $(".send_to").attr("id",user);
    $(".convo_mes").html("Loading conversation <img width='15' height='15' src='./img/load.gif'>");
    setTimeout(function(){auto_scrollmes},3000);
    setTimeout(function(){get_convo(user)},2000);
});

function auto_scrollmes(){
    var objDiv = $("#convo_mes");
    objDiv.scrollTop = objDiv.scrollHeight;
}

它仍然无法正常工作，我一直在更换东西，但仍然没有运气. 这是我的HTML代码:

its still dont work, i kept changing stuff but still no luck. here's my HTML code:

<div id="conversation">
<h2>Conversation</h2>
<hr />
<center>
<div id="convo">
Please select a message to load in here!
</div>
<div id="convo_mes">
<div class="convo_mes">

</div>
</div>
<div id="convo_ctrl">
<textarea spellcheck="false" placeholder="Enter your message here..."                                     id='mes_text_area'></textarea><a href="#send" id="send_message">Send</a>
</div>
</div>

推荐答案

什么在您的代码中不起作用

whats is not working in your code

$(".mes").click(function(){
    var user = $(this).attr("id");
    $("#convo").html("<b>"+user+"</b>");
    $("#convo_ctrl").show();
    $(".send_to").attr("id",user);
    $(".convo_mes").html("Loading conversation <img width='15' height='15' src='./img/load.gif'>");
    setTimeout(function(){auto_scrollmes},3000);
    setTimeout(function(){get_convo(user)},2000);
});

function auto_scrollmes(){
    var objDiv = $("#convo_mes");
    objDiv.scrollTop = objDiv.scrollHeight;
}

#convo_mes{
    text-align:left;
    width:98%;
    height:80%;
    background:#fff;
    border:1px solid #000;
    overflow-x:auto;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="conversation">
<h2>Conversation</h2>
<hr />
<center>
<div id="convo">
Please select a message to load in here!
</div>
<div id="convo_mes">
<div class="convo_mes">

</div>
</div>
<div id="convo_ctrl">
<textarea spellcheck="false" placeholder="Enter your message here..." id='mes_text_area'></textarea><a href="#send" id="send_message">Send</a>
</div>
</div>

这篇关于自动滚动不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！