Перенаправление в начало страницы при перезагрузке от нажатия кнопки

Обычно при перезагрузке страницы ты остаешься на том же месте что был до перезагрузки (если ничего не менял) и у меня все так и работает и это хорошо, но. У меня на сайте есть кнопки в формах, которые отправляют пост запрос на эту же страницу. При этом происходит перезагрузка страницы и перенаправление на начало страницы и это уже плохо. Мне нужно чтобы после нажатия на кнопку я остался ровно на том же месте что и до нажатия. Сделал пример на html-game.site/primer.php там внизу кнопка, ее код:

<form method="POST" action="">
    <input type="submit" name="1" value="Это обычная кнопка input в форме">
</form>

Спасибо за ответ, вот само решение, оно реализовано на jquery:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
var scrl, storage;
storage = sessionStorage.getItem('value');
console.log('Session storage: ' + storage);

$(document).ready(function() {
  window.scrollTo(0, storage);
});

$(window).on("scroll", function() {
  scrl = $(window).scrollTop();
  console.log('Scroll position: ' + $(window).scrollTop());
  sessionStorage.setItem('value', scrl);
});
</script>

Можно сразу копировать в любую часть файла и все будет работать, а этот код фиксирует как по вертикали так и по горизонтали:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
var scrlY, scrlX, x, y;

$(window).on("scroll", function() {
  scrlY = $(window).scrollTop();
  scrlX = $(window).scrollLeft();
  sessionStorage.setItem('valueY', scrlY);
  sessionStorage.setItem('valueX', scrlX);
});
y = sessionStorage.getItem('valueY');
x = sessionStorage.getItem('valueX');
$(document).ready(function() {
  window.scrollTo(x, y);
});
</script>

Ответы (3 шт):

Автор решения: Maxbend

https://snipp.ru/html-css/save-scroll-position Тут описано 3 варианта и если есть только такие варианты, то это печалька.

  1. AJAX мне использовать неудобно, да и тем более придется переписывать кучу кода, хотя видимо это самое адекватное решение.
  2. Якоря вообще не варик так как нужно чтобы страница оставалась в том же месте что и до нажатия на кнопку пиксель в пиксель
  3. Через <input type="hidden"> выглядит как костыль да и у меня слишком много кнопок, так что тоже гемор.
→ Ссылка
Автор решения: Sparklingman

var scrl, storage;
storage = sessionStorage.getItem('value');
console.log('Session storage: ' + storage);

$(document).ready(function() {
  window.scrollTo(0, storage);
});

$(window).on("scroll", function() {
  scrl = $(window).scrollTop();
  console.log('Scroll position: ' + $(window).scrollTop());
  sessionStorage.setItem('value', scrl);
});

→ Ссылка
Автор решения: Sparklingman

var scrlY, scrlX, x, y;

$(window).on("scroll", function() {
  scrlY = $(window).scrollTop();
  scrlX = $(window).scrollLeft();
  sessionStorage.setItem('valueY', scrlY);
  sessionStorage.setItem('valueX', scrlX);
});
y = sessionStorage.getItem('valueY');
x = sessionStorage.getItem('valueX');
$(document).ready(function() {
  window.scrollTo(x, y);
});

→ Ссылка