我犯了一个可怕的错误，没有先查找就使用 html 功能，你看，当我距离部署网站还有几个小时时，我意识到 Safari 不支持数据列表...
http://caniuse.com/#search=datalist
这是一件相当麻烦的事情，因为这个特定网站的大部分受众都是技术障碍者，因此，我预计 safari 将占该网站所有访问量的 30-50%。
现在，我可以看到如何用 JavaScript 为数据列表编写一个简单的 polyfill，这样我就可以只包含一个脚本标签并轻松地解决这个问题，而不必填充我的整个 html，但是我找不到所说的 JavaScript。
我不是要你们写它，如果我想浪费很多时间，我显然可以自己写。我希望你们知道一个经过真正测试的图书馆，我现在似乎无法找到我的愚蠢和愤怒。
在任何人评论这个问题之前，是的，考虑到我的一半用户可能来自那里，我不在 Safari 上进行并行测试是愚蠢的......但事后看来是 20-20
编辑:我应该提一下，我发现了两个令人遗憾的插件，Jquery 和 modernizer 依赖，这真的是我不想接受的那种依赖。
编辑:有人在没有阅读问题的情况下将此问题标记为重复。因此，我将重申我的问题:
我想要一个 Javascript 脚本来填充 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/
另一个答案的问题是: a) 它需要 html 编辑，它不是你可以轻松插入的 javascript，它允许其他人阅读代码而无需去:那他妈的是什么？ b) 它用选择元素替换了数据列表。如果您不希望用户输入除预定义选项以外的任何内容，如果您不关心元素在视觉上的外观以及如果您不关心这样一个事实，而不是键入，它可以达到相同的目的用户必须从列表中进行选择(在移动设备上非常烦人)。
这就是提议的解决方案的工作原理(“重复”问题中的解决方案):
<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/
所以，这个问题确实很相似，但它类似于一个从未按照我希望的方式解决的问题，而不是“necro bumping”(甚至不知道它是否可能)。
现在，举例说明我想要什么(在 github 上进行一些挖掘后发现):
https://github.com/Fyrd/purejs-datalist-polyfill
-> 没有外部依赖，就几百行js和css -> 可以简单地包含在 html 中，它可以使现有的数据列表在不破坏 html 的情况下工作 -> 使输入元素在 safari 和 opear mini 上的行为与在 firefox、chrome 和 android 浏览器中的行为相同。它提供相同的功能并且看起来相同。它不是“这用具有不同行为但经常用于类似情况的元素替换你的元素”它是“这用不支持它的浏览器的 javascript 模仿你的元素”
我将发布类似问题的答案，以防读者需要其他选择。但我想尽可能清楚地解释为什么这不是重复项，因为有人问我。
最佳答案
Safari 支持将成为即将发布的 iOS 和 MacOS 版本的一部分，这些版本很可能会在 2 月底/3 月初发布。
你也可以为此使用另一个 polyfill:https://github.com/mfranzke/datalist-polyfill/
关于javascript - 在 Safari/Opera 上启用数据列表的脚本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40693399/