Modernizr.datalistelem 在 Safari 浏览器中返回 false答案

【问题标题】：Modernizr.datalistelem returning false in safari browserModernizr.datalistelem 在 Safari 浏览器中返回 false
【发布时间】：2016-08-19 11:19:22
【问题描述】：

您好，我创建了一个 html 页面。 link 这里的数据来自电子表格.google.com。在加载过程中显示错误。我在那里找到了一个 javascript 代码，表明浏览器不支持。由于这个原因，我的产品列表也没有显示在下拉列表中。

if (!Modernizr.datalistelem) {
 alert('This browser does not support all Aherns app functionality - suggest using another browser');
}

这是现代化的链接 http://modernizr.com/download/#-input-shiv-cssclasses-addtest-elem_datalist-load

这里 datalist 元素用于此目的。

【问题讨论】：

我不明白你的问题，唯一的错误是我可以看到它缺少类名 page_header 的元素： var header=parent.document.getElementsByClassName('page_header'); header[0].style.display='none' console.log(header);而是在控制台 Modernizr.datalistelem 返回 true
@Infer-on bro 尝试使用数据列表不起作用的 safari 浏览器。

标签： javascript jquery spreadsheet modernizr datalist

【解决方案1】：

你是对的，你可以阅读here，Safari不支持datalist，所以你只能使用Modernzr切换到polyfill

对于那个 HTML：

<input class="destination-list" type="text" placeholder="From:" list="city">

Modernizr.load({
  test: Modernizr.datalistelem,
  nope: ['js/jquery.js', 'js/jquery.datalist.js', 'js/load.datalist.js']
});

其中js/load.datalist.js 包含：

$('input[list]').datalist();

参考：http://www.hongkiat.com/blog/html5-datalist/

【讨论】：