../path не перенаправляет страницу

#javascript #html

#javascript #HTML

Вопрос:

Я пытаюсь перейти на страницу search.html . В зависимости от того, что это за страница, search.html находится либо в том же каталоге, либо в каталоге выше. Я не могу понять, почему он не перенаправляет.

Вот HTML-код:

   <form  class="search" onsubmit="searchSite()">
    <input id="search" title="Seach this site" type="text" name="search"
      placeholder="Search this site..">
  </form>

  

Вот JS-код:

 function searchSite() {
  var search = document.getElementById("search").value.toLowerCase().split(" ");
  searchArticles(search);
  displayResults();
}

function displayResults() {
  if (window.location.href.indexOf("humans") !== -1 
      || window.location.href.indexOf("other")){ 
    window.location.href = "../search.html";
    console.log(window.location.href);}
  else
    window.location.href = "search.html";
}

  

Перед поиском URL-адрес: file:///C:Desktop/comp266/unit5/public_html/other/other.html

После поиска URL-адрес: file:///C:Desktop/comp266/unit5/public_html/other/other.html ?search=good

Но я хочу, чтобы URL-адрес был: file:///C:Desktop/comp266/unit5/public_html/search.html

Комментарии:

1. Ваше условие внутри displayResults содержит ошибку. Он проверяет, что местоположение действительно содержит human , но other часть всегда будет истинной. Вам нужно добавить !== -1 .

2. О, большое вам спасибо, что указали на это!!

Ответ №1:

Это связано с тем, что форма имеет поведение по умолчанию, которое перенаправляет сайт на URL-адрес действия формы или URL-адрес запроса с параметрами запроса, как вы видите.
Вы можете предотвратить это поведение по умолчанию, вернув false при отправке прослушивателя:

   <form  class="search" onsubmit="return searchSite()"> <!-- ADD THIS -->
    <input id="search" title="Seach this site" type="text" name="search"
      placeholder="Search this site..">
  </form>
  
 function searchSite() {
  var search = document.getElementById("search").value.toLowerCase().split(" ");
  searchArticles(search);
  displayResults();

  // ADD THIS
  return false;
}
  

Более правильным способом является выполнение preventDefault на случай, если может возникнуть ошибка, прежде чем возвращать false:

 <form  class="search" onsubmit="return searchSite(event)"> <!-- ADD THIS -->
    <input id="search" title="Seach this site" type="text" name="search"
      placeholder="Search this site..">
  </form>
  
 function searchSite(event) {
  // ADD THIS
  event.preventDefault();

  var search = document.getElementById("search").value.toLowerCase().split(" ");
  searchArticles(search);
  displayResults();

  // ADD THIS
  return false;
}