web-dev-qa-db-ja.com

FirefoxおよびInternet ExplorerでのHTML5入力タイプの日付、色、範囲のサポート

HTML5で多くのフォームを使用して、すべてのWebサイトを構築しました（input型date、color、rangeを使用）

Google Chromeではすべてが正常に機能します。

しかし、Internet ExplorerとFirefoxを有効にすると、すべての入力フィールドはinput type textのようになります。

この入力を強制的に正しく表示させる方法またはスクリプトをダウンロードできますか？

html5internet-explorerfirefoxcross-browser
26
Stanislas Piotrowski

HTML5はまだ完全に標準化されていないため、すべてのブラウザーがこれらの入力タイプをサポートしているわけではありません。 intendedの動作は、<input type="text">にフォールバックすることです。

↪ HTML5入力タイプのブラウザサポートの詳細については、こちらを参照してください。

サポートのテスト ModernizrライブラリまたはカスタムJavaScriptを使用できます。特定のHTML5機能が利用できないことを検出した場合、 JavaScript - basedalternatives にフォールバックできます。

37
user2428118

特別な入力がない場合、すべてのブラウザは入力タイプのテキストにフォールバックします。ウィジェットと検証についてのすべて。

次のサポート範囲ウィジェット

Firefoxデスクトップ23

Firefox 29

Operaデスクトップ

Opaera

Chromeデスクトップ

chrome desktop

Chrome Mobile

Chrome mobile

IOSサファリ5

IOS Safari 5

。

。

。

次のブラウザがカラーウィジェットをサポートするようになりました

Firefoxデスクトップ29

Firefox 29 color input Ubuntu

Operaデスクトップ11

Opera desktop color input

Chromeデスクトップ20：

chrome input type color Ubuntu

Android 4.4/Chromeモバイル：

chrome mobile color input

Operaモバイル：

opera mobile color input

ブラックベリー：

blackberry color input

Firefox OS 1.3

Firefox OSは色入力をサポートするようになりましたが、スクリーンショットはまだありません

Uを使用する場合は、これを使用できます http://www.eyecon.ro/colorpicker/

6
aWebDeveloper

入力type = rangeで同様の問題が発生しました。 Internet Explorer 10を除くすべてのブラウザーですべてが機能していました。他のWebサイトでスライダーが表示されていれば、Internet Explorerの問題ではありませんでした。解決策は、私のウェブサイトの互換表示をオフにすることでした。

1
Vinte Segundos

私が思う最善の解決策は、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/

0
user2506760