Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме 85 тыс рублей в месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 24.11.2022, 13:47   #1
Miray
Новичок
Джуниор
 
Регистрация: 24.11.2022
Сообщений: 4
По умолчанию Строка поиска на html

Всем привет!
Появилась одна проблемка с созданием поиска
Задача такова:
Нужно сделать строку поиска что бы при нажатии на кнопку найти перекидывала URL уже прописанного сайта в коде, и в конце url прибавлялось значение введенное в строку поиска.

То есть допустим прописан сайт https://www.youtube.com/
Пользователь вводит mail
Нажимает поиск и его перекидывает на https://www.youtube.com/mail

Подскажите как это можно реализовать
Miray вне форума Ответить с цитированием
Старый 24.11.2022, 14:49   #2
macomics
Участник клуба
 
Регистрация: 17.04.2022
Сообщений: 1,215
По умолчанию

Создать у кнопки Найти обработчик JavaScript для события OnClick, в котором получить текст введенный в поле для поиска и соединить этот текст с вашим URL, а потом выполнить переадресацию.

Код:
let textEdit = document.getElementById("searchBox");
if (textEdit) window.location.href = "https://www.youtube.com/" + textEdit.value;
Как-то так

Последний раз редактировалось macomics; 24.11.2022 в 14:51.
macomics вне форума Ответить с цитированием
Старый 24.11.2022, 15:42   #3
Miray
Новичок
Джуниор
 
Регистрация: 24.11.2022
Сообщений: 4
По умолчанию

Цитата:
Сообщение от macomics Посмотреть сообщение
https://www.youtube.com/
Постарался сделать как вы ответили я немного хлебушек еще в HTML
Код написал но совместить не смог, можете пожалуйста подсказать что не так?
При поиске строка просто меняется на название бокса = введённому значению внутрь поля
qen=fgdfgd&url=Найти

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Поиск</title>
</head>
<body>
<form>
<p><input type="search" name="qen" placeholder="Поиск">
<input type="submit" name="url" value="Найти"></p>
<script>
btn.onclick = function() {
let textEdit = document.getElementById("url");
if (textEdit) window.location.href = "https://www.youtube.com/" + textEdit.value;
}
</script>
</form>
</body>
</html>
Miray вне форума Ответить с цитированием
Старый 24.11.2022, 16:57   #4
macomics
Участник клуба
 
Регистрация: 17.04.2022
Сообщений: 1,215
По умолчанию

А почему вы ищите кнопку, а не поле ввода? Вам надо искать qen, а не url.

Далее первая строчка находит это поле для ввода, а вторая проверяет найденное поле на успешность поиска и переходит по ссылке получаемой сцеплением строки "https://www.youtube.com/" и значения из поля value (его и ввел пользователь).

Обработчик можно задать вот так
Код HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Поиск</title>
<script>function search_name(aName) {
  let textEdit = document.getElementById(aName);
  if (textEdit) window.location.href = "https://www.youtube.com/" + textEdit.value;
}</script>
</head>
<body>
<form>
<p><input id="qen" type="search" name="qen" placeholder="Поиск">  <!-- qen.value="" -->
<input type="button" name="url" value="Найти" OnClick="search_name('qen')"></p>
</form>
</body>
</html>

Последний раз редактировалось macomics; 24.11.2022 в 17:07.
macomics вне форума Ответить с цитированием
Старый 25.11.2022, 10:02   #5
ADSoft
Старожил
 
Регистрация: 25.02.2007
Сообщений: 4,037
По умолчанию

форма и метод get

Код:
<form action="/" method="get">
<input id="qen" type="text" name="search" placeholder="Поиск">
<input type="submit" value="Найти">
</form>
правда итоговая строка будет что-то типа
https://www.youtube.com?search=mail

но оно и к лучшему
ADSoft вне форума Ответить с цитированием
Старый 25.11.2022, 17:03   #6
Miray
Новичок
Джуниор
 
Регистрация: 24.11.2022
Сообщений: 4
По умолчанию

macomics,
Спасибо тебе добрый человек! Ты мне почти жизнь спас
Miray вне форума Ответить с цитированием
Старый 25.11.2022, 17:04   #7
Miray
Новичок
Джуниор
 
Регистрация: 24.11.2022
Сообщений: 4
По умолчанию

ADSoft,
Спасибо! Методом тоже пробовал но настроить его нормально не могу
Miray вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме 85 тыс рублей в месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
CSS + HTML добавить ссылку для поиска zoneclimat HTML и CSS 1 02.05.2012 06:16
html командная строка bookkc Помощь студентам 5 09.02.2011 22:34
На входе: строка - цветовая спецификация HTML yahoo JavaScript, Ajax 4 18.01.2011 22:45
На входе: строка - цветовая спецификация HTML yahoo JavaScript, Ajax 0 23.12.2010 03:40
строка для поиска vlastelin HTML и CSS 10 10.08.2010 17:09