HTML: <input>Не можете использовать одновременно "pattern =" и "list ="? - PullRequest
0 голосов
/ 12 сентября 2018

Я предоставляю поле ввода для отправки пользователям. Одним из которых является URL. Я хотел бы ограничить разрешенные URL-адреса, как показано ниже:

        <input name="source" type="url" pattern="https://www.youtube.com/(.+)|https://www.vimeo.com/(.+)|https://open.spotify.com/(.+)|https://www.soundcloud.com/(.+)|https://www.deezer.com/(.+)" placeholder="{$lng->source_place}" value="{$source}">

Это отлично работает. У меня также есть другой подход, в котором вместо поля отображается раскрывающееся меню, показывающее, какие URL рекомендованы для отправки:

        <input name="source" type="url" list="defaultURLs">
                        <datalist id="defaultURLs">
                          <option value="https://www.youtube.com/">
                          <option value="https://www.vimeo.com/">
                          <option value="https://open.spotify.com/">
                          <option value="https://www.soundcloud.com/">
                          <option value="https://www.deezer.com/">
                        </datalist>

Это также прекрасно работает само по себе, однако не мешает пользователю отправлять другие URL-адреса.

Я попытался объединить эти два параметра, чтобы рекомендуемые сайты были представлены в раскрывающемся меню, и эти варианты применяются принудительно. Итак, теоретически что-то вроде этого:

<input name="source" type="url" list="defaultURLs" pattern="https://www.youtube.com/(.+)|https://www.vimeo.com/(.+)|https://open.spotify.com/(.+)|https://www.soundcloud.com/(.+)|https://www.deezer.com/(.+)|http://bbcsfx.acropolis.org.uk/(.+)|https://soundbible.com/(.+)" placeholder="URLs" value="{$source}">
                        <datalist id="defaultURLs">
                          <option value="https://www.youtube.com/">
                          <option value="https://www.vimeo.com/">
                          <option value="https://open.spotify.com/">
                          <option value="https://www.soundcloud.com/">
                          <option value="https://www.deezer.com/">
                        </datalist>

Однако применяется только «pattern =» без раскрывающегося меню.

Мне показалось, что я где-то читал (и снова тупо не могу найти ссылку), что это было невозможно, но в той же теме кто-то нашел обходной путь.

Любые мысли / отзывы приветствуются

...