Html Firefox 和 Internet Explorer 中的 HTML5 输入类型日期、颜色、范围支持
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12455506/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML5 input type date, color, range support in Firefox and Internet Explorer
提问by Stanislas Piotrowski
I've build all my website using many forms with HTML5 (using the inputtypes date, colorand range.)
我已经使用 HTML5 的多种表单构建了我所有的网站（使用input类型date,color和range.）
Everything works fine in Google Chrome.
在谷歌浏览器中一切正常。
But when I turn on Internet Explorer and Firefox, all input fields become like inputtype text.
但是当我打开 Internet Explorer 和 Firefox 时，所有输入字段都变得像inputtype text。
Is there a way or a script I can download to make forcing the displaying of this input correctly?
有没有我可以下载的方法或脚本来强制正确显示此输入？
回答by user2428118
Since HTML5 hasn't been completely standardized yet, not all browsers do support these input types. The intendedbehaviour is to fall back to <input type="text">.
由于 HTML5 尚未完全标准化，因此并非所有浏览器都支持这些输入类型。该预期的行为是回落到<input type="text">。
? See here for more information on browser support for HTML5 input types.
? 有关 HTML5 输入类型的浏览器支持的更多信息，请参见此处。
You can test for supportusing the Modernizr library or with some custom JavaScript. If you detect a certain HTML5 feature isn't available, you can fall back to JavaScript-basedalternatives.
您可以使用 Modernizr 库或一些自定义 JavaScript来测试支持。如果发现某个HTML5功能不可用，你可以回退到JavaScript的-基于替代品。
回答by aWebDeveloper
All browsers fallback to input type text if special input is missing. Its all about widgets and validation.
如果缺少特殊输入，所有浏览器都会回退到输入类型文本。它是关于小部件和验证的。
Following support range widget
以下支持范围小部件
Firefox Desktop 23
火狐桌面版 23
Opera Desktop
歌剧桌面
Chrome Desktop
Chrome 桌面
Chrome Mobile
铬手机
IOS safari 5
IOS Safari 5
.
.
.
.
.
.
Following browsers now supports color widget
以下浏览器现在支持颜色小部件
Firefox Desktop 29
火狐桌面版 29
Opera Desktop 11
歌剧桌面 11
Chrome Desktop 20:
Chrome 桌面 20：
Android 4.4 / Chrome Mobile :
安卓 4.4/Chrome 手机：
Opera mobile:
歌剧手机：
Blackberry:
黑莓：
Firefox os 1.3
火狐操作系统 1.3
Firefox os now supports color input but i still don't have a screen shot
Firefox os 现在支持颜色输入，但我仍然没有屏幕截图
If u want u can use this http://www.eyecon.ro/colorpicker/
如果你想要你可以使用这个http://www.eyecon.ro/colorpicker/
回答by Vinte Segundos
I had a similar problem with input type=range. Everything was working on all browser, except for Internet Explorer 10. It was not a problem with Internet Explorer, given that I could see the slider in other websites. The solution was to turn off i.e. compatibility view for my website.
我对输入类型=范围有类似的问题。除了 Internet Explorer 10 之外，所有浏览器都可以正常工作。 Internet Explorer 没有问题，因为我可以在其他网站上看到滑块。解决方案是关闭我网站的 ie 兼容性视图。
回答by user2506760
the best solution I think is to use jquery plugins.
我认为最好的解决方案是使用 jquery 插件。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Slider - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function() {
$( "#slider" ).slider();
});
</script>
</head>
<body>
<div id="slider"></div>
</body>
</html>
