it-swarm.com.de

HTML5-Eingabetyp für Datum, Farbe und Bereich in Firefox und Internet Explorer

Ich habe meine gesamte Website mit vielen Formularen mit HTML5 erstellt (mit den input-Typen date, color und range)

In Google Chrome funktioniert alles einwandfrei.

Wenn ich jedoch Internet Explorer und Firefox aktiviere, werden alle Eingabefelder wie input type text.

Gibt es eine Möglichkeit oder ein Skript, das ich herunterladen kann, um die Anzeige dieser Eingabe korrekt zu erzwingen?

26

Da HTML5 noch nicht vollständig standardisiert ist, unterstützen nicht alle Browser diese Eingabetypen. Das beabsichtigte Verhalten soll auf <input type="text"> zurückgreifen.

{ Weitere Informationen zur Browser-Unterstützung für HTML5-Eingabetypen finden Sie hier.

Sie können für Support testen mit der Modernizr-Bibliothek oder mit einem benutzerdefinierten JavaScript verwenden. Wenn Sie feststellen, dass eine bestimmte HTML5-Funktion nicht verfügbar ist, können Sie auf JavaScript - basiertAlternativen zurückgreifen.

37
user2428118

Bei allen Browsern wird Text als Eingabe verwendet, wenn spezielle Eingaben fehlen. Es geht um Widgets und Validierung. 

Folgendes Widget für den Supportbereich

Firefox-Desktop 23

Firefox 29

Opera Desktop

Opaera

Chrome Desktop

chrome desktop

Chrome Mobile

Chrome mobile

IOS Safari 5

IOS Safari 5

.

.

.

Folgende Browser unterstützen jetzt das Farb-Widget

Firefox-Desktop 29

Firefox 29 color input Ubuntu

Opera Desktop 11

Opera desktop color input

Chrome Desktop 20:

chrome input type color Ubuntu

Android 4.4/Chrome Mobile:

chrome mobile color input

Opera Mobile:

opera mobile color input

Brombeere:

blackberry color input

Firefox os 1.3

Firefox OS unterstützt jetzt die Farbeingabe, aber ich habe immer noch keinen Screenshot

Wenn Sie möchten, können Sie diese verwenden http://www.eyecon.ro/colorpicker/

6
aWebDeveloper

Ich hatte ein ähnliches Problem mit dem Eingabetyp = Bereich. Mit dem Internet Explorer 10 funktionierte alles auf allen Browsern. Es war kein Problem mit dem Internet Explorer, da ich den Schieberegler auf anderen Websites sehen konnte. Die Lösung bestand darin, die Kompatibilitätsansicht für meine Website zu deaktivieren.

1
Vinte Segundos

ich denke, die beste Lösung ist die Verwendung von Jquery-Plugins.

<!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