26

我已经使用许多带有 HTML5 的表单构建了我所有的网站（使用inputtypesdate和.）colorrange

在谷歌浏览器中一切正常。

但是当我打开 Internet Explorer 和 Firefox 时，所有输入字段都变成了inputtype text。

我可以下载一种方法或脚本来强制正确显示此输入吗？

4

4 回答 4

37

由于 HTML5 尚未完全标准化，并非所有浏览器都支持这些输入类型。预期的行为是回退到<input type="text">.

↪有关浏览器对 HTML5 输入类型的支持的更多信息，请参见此处。

您可以使用 Modernizr 库或一些自定义 JavaScript测试支持。如果您检测到某个 HTML5 功能不可用，您可以回退到基于JavaScript的替代方案。

于 2012-09-17T09:08:43.573 回答
6

如果缺少特殊输入，所有浏览器都会回退到输入类型文本。它都是关于小部件和验证的。

以下支持范围小部件

火狐桌面 23

火狐 29

Opera 桌面版

歌剧

铬桌面

铬桌面

Chrome 手机

铬手机

IOS Safari 5

IOS Safari 5

.

.

.

以下浏览器现在支持颜色小部件

火狐桌面版 29

Firefox 29 色输入 Ubuntu

Opera 桌面版 11

Opera桌面颜色输入

Chrome 桌面 20：

chrome 输入类型 颜色 Ubuntu

Android 4.4 / Chrome 手机：

chrome手机颜色输入

歌剧手机：

Opera 移动颜色输入

黑莓：

黑莓颜色输入

火狐操作系统 1.3

Firefox 操作系统现在支持颜色输入，但我仍然没有屏幕截图

如果你想要你可以使用这个http://www.eyecon.ro/colorpicker/

于 2014-04-30T08:08:19.230 回答
1

我在输入类型 = 范围时遇到了类似的问题。除了 Internet Explorer 10 之外，所有浏览器都可以正常工作。Internet Explorer 没有问题，因为我可以在其他网站上看到滑块。解决方案是关闭我网站的兼容性视图。

于 2013-10-24T00:29:40.210 回答
0

我认为最好的解决方案是使用 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>

http://jqueryui.com/slider/

于 2013-10-24T04:32:28.393 回答