Question

我对如何使这项工作缺乏想法。代码是：

$('#inboxArea').on('click', '.readMessage', function(){
var tix_id = $(this).data('id');
var tix_sub = $(this).data('sub');
var tix_date = $(this).data('date');

$.ajax({
    type: 'GET',
    url: 'user/messages/'+tix_id+'/'+tix_sub+'/'+tix_date,
    success: function(data){
        $('#inboxArea').html(data);
    }
});
$('#msgScroll').animate({ scrollTop: $('#msgScroll')[0].scrollHeight}, 500);

}）;

当你点击.readMessage它应该通过ajax将一系列div放到#inboxArea时，应该发生什么。我希望名为#msgScroll的div在之后自动向下滚动。问题是，#msgScroll是使用此功能将#inboxArea插入#inboxArea的一部分。

如果有帮助，那么应该在#msgScroll注意<button id="msgBack">Back</button> <h3>Inbox</h3> <div class="panel-group"> <div class="panel panel-default"> <div class="panel-heading"> <div class="row"> <div class="col-lg-9">'.$sub.'</div> <div class="col-lg-3">'.$date.'</div> </div> </div> <div class="panel-body scroll" id="msgScroll"> <div id="msgBody">'; foreach($messages as $message){ echo ' <p>From: '.$message->name.'</p> <p>Message: '.$message->message.'</p> <hr>'; } echo' </div> </div> </div> </div> <div class="form-group"> <textarea class="form-control" rows="4" id="msgReply" placeholder="Reply..." name="message" required></textarea> </div> <button id="msgSendReply" data-tid="'.$id.'">Send Reply</button>注意到这一点。

nameof

Answer 1

msgScroll功能将填充$.ajax()，在成功回调处理程序中移动animate()

success: function(data) {
    $('#inboxArea').html(data);
    $('#msgScroll').animate({
        scrollTop: $('#msgScroll')[0].scrollHeight
    }, 500);
}

自动向下滚动到动态生成的div的底部

1 个答案: