Использование location.replace с данными из формы

Question

У меня есть HTML-форма, которую я пытаюсь использовать для перехода на другую страницу.Я пытался использовать window.location.replace, чтобы добавить значение ввода в конец формы следующим образом:

До: https://example.com/search

После: https://example.com/search/formvalue

Я испробовал почти все трюки, которые смог найти, но не повезло.Мне удалось заставить его работать, заменив window.location.replace на window.open, но я не хочу открывать его в новой вкладке.Я также попробовал window.location.assign, но мне больше не повезло.Я попытался запустить обе эти функции в консоли Chrome, и они отлично работали.Мой код ниже.

function onenter() {
  var term = document.getElementById("searchbox").value;
  window.location.replace("/search/" + term);
}

<form method="GET" onsubmit="onenter();">
  <input id="searchbox" name="term" type="text" autofocus>
  <button id="searchenter" type="submit">Enter</button>
</form>

Что я делаю неправильно / отсутствует?

Answer 1

Ваша проблема в том, что отправка формы перезагружает страницу. Используйте eventObject.preventDefault:

function onenter(event) {
  event.preventDefault();
  var term = document.getElementById("searchbox").value;
  window.location.replace("/search/" + term);
  console.log(window.location);
}

<form method="GET" onsubmit="onenter(e);">
  <input id="searchbox" name="term" type="text" autofocus>
  <button id="searchenter" type="submit">Enter</button>
</form>