Прокрутите страницу до конца после отправки формы JQuery

Question

У меня есть чат, основанный на плагине формы jQuery. Ниже приведен сценарий, позволяющий прокручивать вниз до последнего сообщения, когда страница открыта, обновлять тело чата, чтобы видеть новые новые сообщения, и обрабатывать поле ввода (id = 11) при отправке сообщения.

Я хочу прокрутить страницу вниз до последнего сообщения, когда сообщение отправлено, и тело чата перезагрузится. Я пытался использовать это в функции «success» #myForm, но это не работает.

window.onload = function() { 
 
    document.getElementById('scroll').scrollTop = 9999999999; 
 
} 
 

 
$(document).ready(function() { 
 

 
    refreshChat(); 
 

 
}); 
 

 
function refreshChat() { 
 

 
    $('#scroll').load('getchat.php', function() { 
 
    setTimeout(refreshChat, 1000); 
 
    }); 
 
} 
 

 

 
var options = { 
 
    clearForm: true, 
 
    resetForm: true, 
 
    beforeSubmit: function() { 
 
    $('#11').val('sending...'); 
 
    $('#11').attr('disabled', true); 
 
    }, 
 
    success: function() { 
 
    $('#11').val(''); 
 
    $('#11').attr('disabled', false); 
 
    $('#scroll').scrollTop(9999999999); // Part I'm trying to work on 
 
    } 
 

 
}; 
 

 
$('#myForm').ajaxForm(options);

<form id="myForm" name="message" enctype="multipart/form-data" method="post" action="sendmessage.php"> 
 
    <div class="row"> 
 
    <div class="large-12 columns"> 
 
     <div class="row collapse"> 
 
     <div class="large-11 medium-10 small-9 columns"> 
 
      <input type="text" name="message" id="11" class="chat-message radius" placeholder="Type your message here..."> 
 
     </div> 
 
     <div class="large-1 medium-2 small-3 columns"> 
 
      <input type="submit" class="button postfix radius" value="Send"> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</form>

Answer 1

Я хотел бы предложить, чтобы написать функцию, как в этом Jquery бот https://github.com/syaifulsz/simple-jquery-chatbot

здесь функция вызывается после каждого сообщения

function scrollToMessage() { 
    var msgBox = $('#the name of the box'); 
    var height = msgBox[0].scrollHeight; 
    msgBox.scrollTop(height); 
}