web-dev-qa-db-fra.com

Prise en charge du type d'entrée HTML5 date, couleur et plage dans Firefox et Internet Explorer

J'ai construit tout mon site Web en utilisant de nombreux formulaires avec HTML5 (en utilisant les types input, date, color et range.)

Tout fonctionne bien dans Google Chrome.

Mais lorsque j'active Internet Explorer et Firefox, tous les champs de saisie deviennent du type input, tapez text.

Existe-t-il un moyen ou un script que je peux télécharger pour forcer l'affichage de cette entrée correctement?

html5internet-explorerfirefoxcross-browser
26
Stanislas Piotrowski

Étant donné que HTML5 n’a pas encore été complètement normalisé, tous les navigateurs ne prennent pas en charge ces types de saisie. Le comportement intentionnel consiste à se replier sur <input type="text">.

↪ Voir ici pour plus d'informations sur la prise en charge par le navigateur des types de saisie HTML5.

Vous pouvez tester le support en utilisant la bibliothèque Modernizr ou avec du JavaScript personnalisé. Si vous détectez qu'une certaine fonctionnalité HTML5 n'est pas disponible, vous pouvez revenir à JavaScript - baséalternatives .

37
user2428118

Tous les navigateurs ont recours au texte de type en entrée si une entrée spéciale est manquante. Tout sur les widgets et la validation. 

Suivi du widget de plage de support

Firefox Desktop 23

Firefox 29

Opera Desktop

Opaera

Chrome Desktop

chrome desktop

Chrome Mobile

Chrome mobile

Safari IOS 5

IOS Safari 5

.

.

.

Les navigateurs suivants supportent maintenant le widget couleur

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

La mûre:

blackberry color input

Firefox OS 1.3

Firefox OS prend désormais en charge la saisie couleur mais je n'ai toujours pas de capture d'écran.

Si tu veux, tu peux utiliser ceci http://www.eyecon.ro/colorpicker/

6
aWebDeveloper

J'ai eu un problème similaire avec type d'entrée = plage. Tout fonctionnait sur tous les navigateurs, à l'exception d'Internet Explorer 10. Ce n'était pas un problème avec Internet Explorer, étant donné que je pouvais voir le curseur dans d'autres sites Web. La solution consistait à désactiver, c'est-à-dire, la vue de compatibilité pour mon site Web.

1
Vinte Segundos

la meilleure solution à mon avis est d'utiliser des 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>

http://jqueryui.com/slider/

0
user2506760