Как добавить два тега Select с помощью кнопки «Отправить» для перехода по URL-адресу URL - PullRequest
Новая
       14

Как добавить два тега Select с помощью кнопки «Отправить» для перехода по URL-адресу URL

0 голосов
/ 18 апреля 2019

Я пытаюсь настроить селектор выпадающего меню.

Когда посетитель выбирает «Volvo» из первого выпадающего меню и выбирает «Белый» из второго выпадающего меню, затем нажимает кнопку «Отправить».Он должен перейти к URL-адресу 1 и т. Д.

Могу ли я это сделать? 

<body>

  <select>
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
  </select>

  <select>
    <option value="white">White</option>
    <option value="black">Black</option>
    <option value="red">Red</option>
    <option value="blue">Blue</option>
  </select>

</body>

Ответы [ 3 ]

1 голос
/ 18 апреля 2019 
<form target="_blank" action="/page_url" method="get">
  <select name="carbrand">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel" selected="selected">Opel</option>
    <option value="audi">Audi</option>
  </select>

  <select name="carcolor">
    <option value="white">White</option>
    <option value="black">Black</option>
    <option value="red" selected="selected">Red</option>
    <option value="blue">Blue</option>
  </select>

  <br/><br/>

  <input type="submit" value="Submit">  
</form>

Вы можете использовать теги form и input.

Как и в примере выше, после нажатия на кнопку откроется новая страница (атрибут target="_blank" открывает URL-адрес в новом окнеили вкладка).

В этом случае, используя атрибут формы method="get", значения раскрывающихся списков передаются в качестве параметров в URI /page_url?carbrand=opel&carcolor=red.Если вместо этого используется атрибут формы method="post", значения раскрывающихся списков в URL отсутствуют.

0 голосов
/ 18 апреля 2019

Вы можете поместить свои выпадающие списки в форму, чтобы при отправке формы (с помощью кнопки отправки) вы могли затем использовать значения формы, чтобы определить, какой контент загружать.

В качестве альтернативы, если вы хотите сделать это без логики на стороне сервера, вы замените кнопку отправки простой <button type="button"...>, и при нажатии этой кнопки обработайте логику, чтобы открыть нужную страницу.

0 голосов
/ 18 апреля 2019

Я думаю, вы должны использовать это так: 

    <option value="volvo"><a href='http://example.com'>Volvo</a></option>

  </select>```
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...