如何构建优雅降级的HTML5范围？ [英] How do I build a gracefully-degrading HTML5 Range?

问题描述

我想使用HTML5中的< input type ='range'/> 来支持它并降级为< select /> 如果没有。我正在使用Ruby-on-Rails，所以其他方面都失败了，我可以做一些像这个的事情。服务器端。

I'd like to use the <input type='range' /> from HTML5 for browsers that support it and degrade to a <select /> if not. I'm using Ruby-on-Rails, so failing all else, I could do something like this on the server-side.

但我更喜欢通过Javascript实现渐进增强的想法。奖金分如果是JQuery。

I would prefer, though, to have something more inline with the idea of progressive enhancement done via Javascript. Bonus points if it's JQuery.

推荐答案

查看 Modernizr ，它会告诉您是否支持范围。我相信该技术是创建一个范围输入并检查它的类型 - 如果它仍然是范围，那么它是支持的。否则它应该报告文本，这是其他浏览器中的后备。

Check out Modernizr, it will tell you if range is supported. I believe the technique is to create a range input and check it's type — if it is still "range" then it is supported. Otherwise it should report "text" which is the fallback in other browsers.

这篇关于如何构建优雅降级的HTML5范围？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！