Как убрать перезагрузку страницы после отправки формы?

Question

[jIVOYz]

У меня вот проблема с формами на HTML и Javascript.
Я когда нажимаю на её отправку у меня перезагружается страница.
Попробовал все ответы, никак не помогает.
Хотелось бы решение на чистом JS.

Вот код:
HTML:

<form  onsubmit="return checkForm(this)" method="post">
        <input type="text" placeholder="Login" name="name" id="login">
        <br>
        <br>
        <input type="password" placeholder="Password" name="pass">
        <br>
        <br>
        <input type="button" value="Register" id="button_register" onclick="onClickButton(this)">
        <div id="error" style="color: red;">div>
</form>

Javascript:

function checkForm(el) {
 var name  = el.name.value;
 var pass = el.pass.value;
 var fail = "";
 if(name == "" || pass == "") 
     fail = "Заполните все поля";
 else if (name.length < 3)
     fail = "Имя должно иметь минимум три символа";
 else if (name.split("%").length > 1 || name.split("!".length > 1) || name.split("&"))
     fail = "Запрещёные знаки: %, !, &";
 if (fail != "") {
     document.getElementById('error').innerHTML = fail;
     return false;
 } else {
     alert("Все данные корректно заполнены");
 }
 return false;
}

Comments

[Rustam Bainazarov]

Код нужно обернуть с помощью вот этого, иначе он не отображается.

[Simkav]

Вешаете submit на форму, и в колбеке отменяете стандартное поведение через preventDefault

Answer 1

[v3shin]

fetch

Answer 2

[SupchickCode]

Посмотри на fetch запросы.
Таким образом можно послать запрос на сервер без перезагрузки страница.

P. S. fetch это не jquery

Answer 3

[FeST1VaL]

Вы можете посмотреть примеры на JS и как это выглядит на Jquery youmightnotneedjquery.com