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

* {box-sizing: border-box;}
form {
  position: relative;
  width: 750;
  margin: 25px;
}
input {
  width: 100%;
  height: 42px;
  padding-left: 10px;
  border: 2px solid silver;
  border-radius: 5px;
  outline: none;
  background: #F9F0DA;
  color: #9E9C9C;
}
button {
  position: absolute; 
  top: 0;
  right: 0px;
  width: 42px;
  height: 42px;
  border: none;
  background: silver;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
}
button:before {
  content: "\f002";
  font-family: FontAwesome;
  font-size: 16px;
  color: #F9F0DA;
}
    
<form>
            <input type="text" placeholder="Искать здесь...">
            <button type="submit"></button>
        </form>


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

Автор решения: Алексей Шиманский

button type="submit" - означает, что при клике на неё все данные из формы будут отправлены на сервер. Отсылается запрос всегда по тому адресу, который указан в атрибуте action. Если такой атрибут отсутствует или он пустой action='', то форма будет отправляться на тот же url, на котором находится. Поэтому происходит просто обновление страницы

→ Ссылка