【问题标题】:Modernizr not detecting capability in Chrome & FirefoxModernizr 未检测到 Chrome 和 Firefox 中的功能
【发布时间】:2016-05-29 01:03:21
【问题描述】:

我已经下载了 Modernizr,并且在构建中只包含了一个元素,a[download] 属性

然后我将 modernizr-custom.js 文件包含到我的库中并成功将其添加到我的项目中(没有错误):

<script src="lib/modernizr-custom.js"></script>

我现在正在尝试检测浏览器是否支持此处所述的下载功能

http://caniuse.com/#feat=download

注意,IE 和 Safari 不支持,但 Chrome 和 Firefox 支持。

我正在使用以下 Javascript 代码:

if (Modernizr.adownload) {
  console.log("SUPPORT");
} else {
  console.log("NO SUPPORT");
}

在 IE、Firefox 和 Chrome 上显示不支持。据我所知,它应该显示对 Firefox 和 Chrome 的支持。

以下是我的想法:

  • 我没有在构建中包含我需要的东西吗?
  • 我是否误解了如何使用 modernizr 测试功能?
  • 这是 Modernizr 实现中的错误吗?

【问题讨论】:

  • 感谢 jsfiddle,这是一个非常好的主意,我以后会这样做。
  • 此页面显示每个浏览器的正确结果。哼! modernizr.github.io/Modernizr/test
  • @ChuckLeButt adownload 的测试未包含在您在 jsfiddle 中使用的modernizr 脚本中。
  • 您可能没有使用包含adownload 测试的modernizr 版本。并非所有测试都包含在默认构建中。您可能希望创建一个自定义构建,其中包含您需要在 modernizr.com - download 页面上使用的所有测试

标签: javascript html google-chrome firefox modernizr


【解决方案1】:

为我工作:

/*! modernizr 3.3.1 (Custom Build) | MIT *
 * http://modernizr.com/download/?-adownload-setclasses !*/
!function(e,n,s){function a(e,n){return typeof e===n}function o(){var e,n,s,o,t,i,f;for(var c in r)if(r.hasOwnProperty(c)){if(e=[],n=r[c],n.name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(s=0;s<n.options.aliases.length;s++)e.push(n.options.aliases[s].toLowerCase());for(o=a(n.fn,"function")?n.fn():n.fn,t=0;t<e.length;t++)i=e[t],f=i.split("."),1===f.length?Modernizr[f[0]]=o:(!Modernizr[f[0]]||Modernizr[f[0]]instanceof Boolean||(Modernizr[f[0]]=new Boolean(Modernizr[f[0]])),Modernizr[f[0]][f[1]]=o),l.push((o?"":"no-")+f.join("-"))}}function t(e){var n=c.className,s=Modernizr._config.classPrefix||"";if(u&&(n=n.baseVal),Modernizr._config.enableJSClass){var a=new RegExp("(^|\\s)"+s+"no-js(\\s|$)");n=n.replace(a,"$1"+s+"js$2")}Modernizr._config.enableClasses&&(n+=" "+s+e.join(" "+s),u?c.className.baseVal=n:c.className=n)}function i(){return"function"!=typeof n.createElement?n.createElement(arguments[0]):u?n.createElementNS.call(n,"http://www.w3.org/2000/svg",arguments[0]):n.createElement.apply(n,arguments)}var l=[],r=[],f={_version:"3.3.1",_config:{classPrefix:"",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var s=this;setTimeout(function(){n(s[e])},0)},addTest:function(e,n,s){r.push({name:e,fn:n,options:s})},addAsyncTest:function(e){r.push({name:null,fn:e})}},Modernizr=function(){};Modernizr.prototype=f,Modernizr=new Modernizr;var c=n.documentElement,u="svg"===c.nodeName.toLowerCase();Modernizr.addTest("adownload",!e.externalHost&&"download"in i("a")),o(),t(l),delete f.addTest,delete f.addAsyncTest;for(var d=0;d<Modernizr._q.length;d++)Modernizr._q[d]();e.Modernizr=Modernizr}(window,document);

/* Test code */
if (Modernizr.adownload) {
  document.body.innerHTML = "SUPPORT";
} else {
  document.body.innerHTML = "NO SUPPORT";
}

您确定您的自定义构建包含[下载]?你可能忘记了。 Build from here,你自己看看吧。

【讨论】:

  • 是的,这是正确的。奇怪的是 CDN 版本默认没有包含所有内容:codepen.io/anon/pen/rxbmJb
  • 多么奇怪,通过您的链接下载工作正常,但我做了完全相同的事情(我真的做了)并且它没有工作(没有错误)。 .js 文件的大小和所有内容完全相同,我根本不明白。谢谢
猜你喜欢
  • 2015-05-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-06-01
  • 2021-10-16
相关资源
最近更新 更多