Почему моя страница поднимается после каждого поста

Question

var main = function(){ 
    $('.btn').click(function() { 
    var post = $('.status-box').val(); 
    $('<li>').text(post).prependTo('.posts'); 
    $('.status-box').val(''); 
    $('.counter').text('140'); 
    $('.btn').addClass('disabled'); 
    }); 
    $('.status-box').keyup(function(){ 
    var postLength = $(this).val().length; 
    var charactersLeft = 140 - postLength; 
    $('.counter').text(charactersLeft); 
    if (charactersLeft < 0){ 
     $('.btn').addClass('disabled'); 
     } 
     else if (charactersLeft == 140){ 
     $('.btn').addClass('disabled'); 
     } 
     else { 
     $('.btn').removeClass('disabled'); 
     } 
    }); 
    $('.btn').addClass('disabled'); 
}; 

$(document).ready(main); 

Моя страница постоянно поднимается наверх, когда я делаю сообщение о любых идеях, почему это происходит? У меня есть div с возможностью сделать запись из 140 символов, которая попадает в список и отображается на странице. Каждый раз, когда я делаю одно из этих сообщений, веб-страница поднимается вверх и, чтобы увидеть сообщение, вы должны прокрутить весь путь назад.

Answer 1

Скорее всего, в дополнение к вашей настраиваемой логике событий выполняется стандартное представление формы или ссылка на поведение. Вероятно, он переместится на # или какой-нибудь другой якорь рядом с вашей страницей. Чтобы не допустить этого изменения

$('.btn').click(function() { 
    ... 

к

$('.btn').click(function(event) { 
    event.preventDefault(); 
    ...