Переход на другие файлы html через поисковую строку

Question

Хочу осуществить переход на другой html файл по ключевому слову, допустим у меня есть поисковая строка и кнопка поиска, написав в поисковой строке слово "шифр" и при нажатии кнопки поиска, хочу чтобы открылся другой html файл, как это осуществить?

Answer 1

Во-первых, твой вопрос не имеет ничего общего с CSS, а во-вторых:

/*index.html*/
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <form class="form" onsubmit="changelocation(event)">
    <input type="text" class="main-input">
  </form>
<script src="./script.js"></script>
</body>
</html>

// script.js
  const changelocation = (e) => {
    
    e.preventDefault(); // Предотвращаем отправку формы
    const keyword = document.querySelector('.main-input').value.trim(); // Получаем значение из инпута
    
    // Создаем объект ключ которого - это ключевое слово, а значение - путь к html файлу
    const paths = {
      "шрифт": './fonts.html',
      "картинки": './images.html',
      "иконки": './icons.html',
    }
    // Проверяем существует ли такое ключевое слово
    if(paths[keyword]) {
      window.location.href = paths[keyword] // Переходим по ссылке
    } else {
      alert("Вы указали неверное кодовое слово!")
    }
  }

БЛОГ НА HUSL

Переход на другие файлы html через поисковую строку

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