Я сделал ужасную ошибку в использовании функции html, не глядя сначала, и, и вот, когда я на несколько часов от развертывания веб-сайта, я понимаю, что Safari не есть поддержка DataList ...Сценарий, чтобы включить datalist в Safari/Opera
http://caniuse.com/#search=datalist
Это довольно хлопотное дело, так как большая часть аудитории для данного конкретного сайта состоит из технологически обесцениваются, и, как таковые, я ожидаю, сафари составляет 30- 50% всего доступа на веб-сайте.
Теперь я могу видеть, как простой псевдоним для datalist может быть написан на JavaScript, так что я могу просто добавить тег сценария и безболезненно избавиться от проблемы, не зацикливая весь html, но Я не могу найти указанный JavaScript.
Я не прошу вас, ребята, написать это, я мог бы сделать это сам, если бы захотел потратить кучу времени. Я надеюсь, что вы, ребята, знаете об истинно проверенной библиотеке для этого, что я, в своей глупости и гневе, похоже, не может найти сейчас.
Прежде чем кто-комментарии по этому вопросу, да, это было глупо не делать параллельное тестирование на сафари, учитывая до половины моих пользователей могли оттуда ..., но непредусмотрительность 20-20
редактировать: Должен упомянуть, я нашел два плагина, которые были грустными, зависание от JQuery & зависело, и это действительно такая зависимость, которую я бы предпочел не принимать.
Редактировать: Кто-то отметил этот вопрос как дубликат, явно не прочитав вопросы. Я, как таковой, переформулирую мой вопрос:
Я хочу сценарий Javascript, который заполняет datalists для Safari/Opera mini. Теперь, давайте идти через эти точки, мы будем:
-> Javascript = Hmtml -> polyfill: https://en.wikipedia.org/wiki/Polyfill Позвольте мне TL; DR: Позволяет реализовать функцию, которая не поддерживается браузером.
-> datalist: позволяет динамически вводить слова во входном элементе и предлагает автозаполнение из раскрывающегося списка. Это выглядит следующим образом:
<body>
Choose: <input type="text" list="languages">
<label for="languages">
<datalist id="languages">
<option value="JavaScript"></option>
<option value="Haskell"></option>
<option value="Ruby"></option>
<option value="Go"></option>
<option value="Python"></option>
<option value="etc"></option>
</datalist>
</label>
https://jsfiddle.net/a5o2cna3/
Проблема с другим ответом является то, что: а) принять редактирования HTML, его не в JavaScript, что вы вставить безболезненным и позволяет другим человеческим существам читать код не собирается: Что, черт возьми, это? b) Он ЗАМЕНЯЕТ datalist выбранным элементом. Он может использовать сервер с той же целью, если вы не хотите, чтобы пользователи вводили что-либо, кроме предопределенных опций, если вы не заботитесь о том, как элемент визуально выглядит И если вы не заботитесь о том, что вместо ввода пользователь должен выбрать из списка (очень раздражает на мобильном телефоне).
Это как предлагаемое решение работает (один в «дублировать» вопрос):
<body>
Choose: <input type="text" list="languages">
<label for="languages">
<select id="languages">
<option value="JavaScript">JavaScript</option>
<option value="Haskell">Haskell</option>
<option value="Ruby">Ruby</option>
<option value="Go">Go</option>
<option value="Python">Python</option>
<option value="etc">etc</option>
</select>
</label>
https://jsfiddle.net/vv63pptj/
Таким образом, этот вопрос действительно похожи, но его похожим на вопрос, что WASN» когда-либо решал так, как я хотел, чтобы он его разрешил, а вместо «некрополя» (даже не знаю, возможно ли это).
Теперь, чтобы проиллюстрировать то, что я хотел (и нашел после некоторого копания на GitHub):
https://github.com/Fyrd/purejs-datalist-polyfill
-> Нет внешних зависимостей, всего несколько сотен строк JS и CSS -> Может быть просто включается в html, и он заставляет существующие datalists работать без искажения html. -> Делает элемент ввода на сафари и opear mini так же, как он ведет себя в браузерах Firefox, Chrome и Android. Он предлагает ту же функциональность и выглядит одинаково. Это не «Это заменит вас элементом элементом с другим поведением, но часто используется для подобных ситуаций». A «Это подражает вашему элементу с помощью javascript для браузеров, которые его не поддерживают»
Я отправлю этот ответ на аналогичный вопрос, если люди читают, что хотят альтернативы. Но я хотел как можно яснее объяснить, почему это не дубликат, поскольку меня спрашивали.
См. Обходной путь здесь: http://stackoverflow.com/questions/27494084/html5-datalist-tag-is-not-populating-in-safari –
проверить https://jqueryui.com/autocomplete/ ..you просто нужно вставить исходный файл jquery ... это все .... – repzero
@Tim Это обходное решение, которое заменяет элемент другим, у которого другое поведение, а не то, что я просил. – George