Nouveaux éléments de formulaire dans html5

category Internet & médias sociaux / Web design & développement / Pages web construction

HTML5 introduit un certain nombre de nouveaux éléments de formulaire avec de nouvelles fonctionnalités. Un sous-ensemble remarquable de ces éléments de formulaire est conçu pour permettre un programme de modifier une partie de la page dynamiquement.

Voici les nouveaux éléments de formulaire et ce que vous pouvez faire avec eux:

  • datalist vous permet de fixer une liste de suggestions pour un élément de saisie de texte. Dès que l'utilisateur commence à taper dans le champ de texte, la liste de suggestions apparaît et l'utilisateur peut choisir parmi les suggestions avec la souris. Exemple de code pour un champ de nom:

    Opera est actuellement le seul navigateur qui prend en charge cet élément, mais vous pouvez utiliser le à l'intérieur de l'élément datalist objet pour obtenir les navigateurs non-soutien à afficher votre code.

  • mètre indique une valeur numérique qui tombe dans une plage. La balise prend en charge un certain nombre d'attributs:

  • valeur: Si vous ne spécifiez pas de valeur, la première valeur numérique à l'intérieur du paire devient la valeur.

  • max: La valeur maximale possible de la question.

  • min: La valeur minimale possible de l'élément.

  • haut: Si la valeur peut être définie comme un éventail, ceci est le haut de gamme de la gamme.

  • faible: Si la valeur peut défini comme une gamme, tel est le bas de cette fourchette.




  • optimum: La valeur optimale de l'élément.

La valeur, haut, faible, et optimum les valeurs devraient tous être entre min et max.

On notera que le mètre élément est utilisé pour sortie un élément numérique. Usage "gamme"> pour l'entrée numérique dans un intervalle.

Voici le code pour un simple mètre gamme:

UN

  • sortie est destinée à afficher la sortie de texte. Il indique une section de la page qui peut être modifiée par un script (habituellement javascript). Dans ce fragment de code:

    Ceci est la valeur d'origine

    Lorsque le bouton est pressé, il va appeler le changeOutput () Fonction javascript, ce qui pourrait ressembler à ceci:

     changeOutput fonction () {var myOutput = document.getElementById ("myOutput") - myOutput.value = "La valeur a changé" -} // fin changeOutput

    Lorsque cette fonction est exécutée, il change le contenu de myOutput.

    La sortie élément est actuellement pris en charge uniquement par Opera. Jusqu'à l'utilisation de cet élément devient plus répandue, vous pouvez utiliser la innerHTML attribut de tout élément de la page pour modifier son contenu dynamiquement par le code.

  • indique combien d'une tâche a été achevée (souvent marquée en pourcentage). Il devrait être modifié dans le code javascript. Le code HTML5 peut ressembler à:

    Maintenant détruire le monde. 
    cours:

    La plupart des navigateurs indiquent les progrès en texte brut, mais il est raisonnable de supposer une sorte de jauge visuelle peut devenir disponibles.

    • Le courant HTML5 comprend également un keygen élément qui génère une clé de cryptage pour transmettre des données cryptées à un serveur. Il dispose d'un de ces paramètres:

    • keytype: Indique le type de cryptage. (rsa est standard.)

    • Challenge: Une chaîne transmise avec la clé publique. (Ceci est normalement spécifiée par le serveur).

    Cependant, certains experts en sécurité considèrent le mécanisme de cryptage déjà obsolète, et l'utilisation de l'outil nécessite des connaissances de cryptage qu'un nombre relativement restreint de développeurs Web possèdent. Cet élément est pas actuellement pris en charge dans tous les navigateurs, et il ne peut pas devenir une partie de la norme.

    Articles Similaires

    A propos Auteur
    5 astuces Html5 forme d'entrée 5 astuces Html5 forme d'entrée

    La façon la plus courante pour obtenir l'entrée d'utilisateur pour un programme javascript est en utilisant des éléments de formulaire HTML. La dernière version de HTML, HTML5, dispose de plusieurs nouveaux éléments de formulaire et les…

    Comment changer les valeurs des éléments du tableau en javascript Comment changer les valeurs des éléments du tableau en javascript

    javascript vous donne plusieurs façons de modifier les tableaux. La première façon est de donner un élément de tableau existante une nouvelle valeur. Ceci est aussi facile que l'attribution de la valeur. Suivez ces étapes dans votre…

    Comment créer des listes déroulantes en javascript pour HTML5 et CSS3 programmation Comment créer des listes déroulantes en javascript pour HTML5 et CSS3 programmation

    La façon la plus évidente d'utiliser javascript pour assurer que l'utilisateur entre quelque chose de valable sur votre page HTML5 est de lui fournir des choix valides. La liste déroulante est une façon évidente et facile à…

    Comment interpréter les boutons radio en javascript pour HTML5 et CSS3 programmation Comment interpréter les boutons radio en javascript pour HTML5 et CSS3 programmation

    Obtenir des informations à partir d'un groupe de boutons radio javascript nécessite une technique légèrement différente pour votre page HTML5 que la plupart des éléments de formulaire. Contrairement à la sélectionner objet, il n'y a…

    Comment gérer la saisie de texte et de sortie avec javascript pour HTML5 et CSS3 programmation Comment gérer la saisie de texte et de sortie avec javascript pour HTML5 et CSS3 programmation

    Peut-être l'application la plus intrigante du DOM dans javascript est la capacité de permettre à l'utilisateur de communiquer avec le programme à travers la page web HTML5, sans toutes ces boîtes de dialogue ennuyeux. Voici une page avec…

    Comment utiliser les propriétés de formulaire à coder avec javascript Comment utiliser les propriétés de formulaire à coder avec javascript

    En javascript, les propriétés de la Forme objet correspondent avec les attributs de l'élément de formulaire HTML. Ils sont utilisés pour obtenir ou définir les valeurs de l'HTML forme attributs d'élément avec javascript. Consultez…

    Sélecteurs et filtres Jquery Sélecteurs et filtres Jquery

    Une partie de la puissance de jQuery est basée sur sa capacité à sélectionner des sections particulières de la page. Ce tableau comprend plusieurs sélecteurs et des filtres couramment utilisés.Selector / FiltreRecherches pour # 133- $…

    Travailler avec les teneurs en éléments de code avec javascript Travailler avec les teneurs en éléments de code avec javascript

    En javascript, vous pouvez afficher les types de nœuds et les valeurs de nœud en utilisant le DOM HTML. Vous pouvez également définir les valeurs des propriétés d'éléments dans le DOM en utilisant la Élément objet. Lorsque vous…

    Attributs de nouveaux éléments de formulaire dans html5 Attributs de nouveaux éléments de formulaire dans html5

    HTML5 introduit de nouveaux éléments de formulaire et donne tous les éléments de formulaire quelques nouveaux goodies. Comme vous concevez et construisez des pages Web, vous pouvez appliquer ces nouveaux attributs et les capacités à tout…

    Comment construire une case à cocher dans votre formulaire de html5 Comment construire une case à cocher dans votre formulaire de html5

    Parfois, vous voulez que vos utilisateurs de pages Web pour indiquer si l'information est vraie ou fausse. Le HTML5 case élément est parfait pour ce genre d'entrée, car l'utilisateur peut cliquer pour sélectionner ou désélectionner l'option.…

    Comment mettre des boîtes de texte dans un formulaire de html5 Comment mettre des boîtes de texte dans un formulaire de html5

    La plupart des utilisations éléments de formulaire HTML5 sont basées sur le contribution tag. Cette bête pages bâtiment-web est une balise à usage général utilisé pour faire un certain nombre d'objets d'entrée intéressants, mais il est…

    HTML5 et javascript options de sélection HTML5 et javascript options de sélection

    Parmi les nombreuses nouvelles fonctionnalités de HTML5, les innovations ayant le potentiel le plus ambitieux sont dans les ajouts à javascript disponibles dans les navigateurs modernes. javascript est habituellement utilisé pour…

    De nouveaux types de saisie de formulaire en HTML5 De nouveaux types de saisie de formulaire en HTML5

    Formulaires HTML sont centrées autour de l'humble mais flexible contribution élément. HTML5 ajoute un certain nombre de formes très utiles d'entrée qui aident à tourner HTML en un outil d'interface utilisateur plus moderne.Bien que le soutien…

    Changez votre page web avec les méthodes du modèle objet de document javascript Changez votre page web avec les méthodes du modèle objet de document javascript

    Les méthodes Object Model de documents indiqués dans la liste suivante vous offrent un excellent moyen pour accéder et modifier vos pages Web grâce à votre code javascript.monElement = document.getElementById ("nom") -: Obtient un…

    » » » » Nouveaux éléments de formulaire dans html5