26

inputHTML5を使用した多くのフォームを使用して(タイプdatecolorおよびを使用して)すべてのWebサイトを構築しましたrange

GoogleChromeではすべて正常に動作します。

しかし、Internet ExplorerとFirefoxをオンにすると、すべての入力フィールドがinputタイプのようになりtextます。

この入力を正しく表示させるためにダウンロードできる方法やスクリプトはありますか?

4

4 に答える 4

37

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

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

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

于 2012-09-17T09:08:43.573 に答える
6

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

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

Firefoxデスクトップ23

Firefox 29

Operaデスクトップ

オパエラ

Chromeデスクトップ

クロームデスクトップ

Chrome Mobile

Chromeモバイル

IOSサファリ5

IOS Safari 5

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

Firefoxデスクトップ29

Firefox29カラー入力Ubuntu

Operaデスクトップ11

Operaデスクトップカラー入力

Chromeデスクトップ20:

クローム入力タイプカラーUbuntu

Android 4.4 / Chrome Mobile:

クロームモバイルカラー入力

Opera mobile:

オペラモバイルカラー入力

ブラックベリー:

ブラックベリーカラー入力

Firefox os 1.3

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

必要に応じて、このhttp://www.eyecon.ro/colorpicker/を使用できます。

于 2014-04-30T08:08:19.230 に答える
1

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

于 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 に答える